NYCPHP Meetup

[Jayesh Sheth]

Hello Mark,

As the others have pointed out, there are basically three ways of adding 
form elements to the page:

1) The first one is an immediate addition to the page of a certain 
element. This can be accomplished in version 5.0 + browsers (IE 5+, 
Netscape 6+)  using the W3C Document Object Model specification and 
JavaScript. This page by Peter-Paul Koch explains how to dynamically add 
a table row ( tr ) to a table. 
http://www.xs4all.nl/~ppk/js/tablefun.html  . I am sure a similar thing 
can be accomplished with form input  and select | option elements. In 
this case, you are really adding or removing elements from a page. A 
good introduction to the DOM and its uses can be found at mozilla.org : 
http://www.mozilla.org/docs/dom/domref/dom_intro.html . Although adding 
and removing elements this way can be tedious, it is one way of doing it.

2)You create, say, 10 form elements on the page, and "hide" 9 of them, 
by using a snippet of JavaScript which will set those 9 to be invisible. 
So, for example, you could have something like (I left the lesser than 
and greater than signs out)
  input class="elem0" value="something 0"
  input class="elem1" value="something 1"
  ...
  input class="elem8" value="something 8"

and then on your page you link the stylesheet mystyle.css in the head 
section, whose contents look like this:

input.elem0 { display:inline; }
input.elem1 { display:none; }
...
input.elem8 { display:none; }

thus all elements except the first are hidden when the page loads. Then, 
using a JavaScript snippet, you can selectively make others visible.
I have only tried this with paragraphs ( the P tag) so I am not sure if 
this wil work.

The code for hiding and unhiding elements can be found here:
http://www.xs4all.nl/~ppk/js/blockinvi.html

and also:

http://www.xs4all.nl/~ppk/js/display.html

The important difference between hiding elements here is that there are 
still there - you just can't see them. In the first example, with the 
DOM you can really remove the elements, so they are gone.

3) Another solution - and appropriate for this discussion group - is 
using JavaScript to redirect your page (and the chose elements) to a PHP 
processing script, which will figure out what the user has chosen so 
far, and build extra form elements to the page, before submitting it 
back. The benefit of this is that older browsers (such as Netscape 4.x) 
will be able to use the form you made, because they cannot handle the 
advanced DOM add/remove of elements, and can barely handle the hiding 
/unhiding stuff.

I hope this helps. If you need more specific code, please let me know.

Kind Regards,

- Jay

Mark Jia wrote:

>I got an interface project, but I never be an interface programmer, I think a lot of people out there could know this or could give me some hints, here is my problem:
>I have one text field and a button,  if user want to ask for another text field, user just simply click on the button, then another text field will be generate right after the previous text filed,  user can generate unlimited fields, this function should work for both IE5.0+ and Netcape4.0+.
>like this:
>                                         -------------------------          ----------------------------------------
> Enter your account    :       |                         |         |click if you have more accts|
>                                         --------------------------          -----------------------------------------
>when user click on "click if you have more accounts", another text filed will be generate right on the next line. 
>I know it will use Javascript, also some knowledge about windows DOM structure, I didn't find some similar website, could you give me some hints? or give me a website using this kind of text fileds.
>sorry it is not a PHP question.
>Thank you for your help!
>Mark 
>
>
>Regards
>
>Mark Jia
>
>
>--- Unsubscribe at http://nyphp.org/list ---
>
>
>  
>