Dynamic input field generation

[Rosebud]

Hello,

I'd like some help trying to generate input fields on the fly. What I
have on an HTML page is a single text input field labelled #1, e.g. #1
<input type="text">. Next to the field is a button that, on click, I'd
like to automatically generate a second text input field below the
first, labelled #2. Everytime the button is clicked, another field is
created with an incremented label.

I explored iframes, but these text fields will be part of a larger
form that has to be passed together. I'd rather not use hidden text
fields because I don't want to hardcode a limit to the number of
fields available. Please point me in the right direction, or let me
know if this isn't possible.

Thanks.

[steve stevo]

Re: Dynamic input field generation

try this

place this code in the head
<script>
var i=1 // count amount of formfields
function createNewInput( ){
i++
findObj("dynFor m").innerHTML+= "<br><input type='text' id='field" + i + "'
value='whatever '>"
findObj("dynFor m").innerHTML+= "<input type='button' value='add new'
onClick='create NewInput()'>"
alert(findObj(" dynForm").inner HTML)
}

function findObj(n, d) { //v4.0
var p,i,x; if(!d) d=document;
if((p=n.indexOf ("?"))>0&&paren t.frames.length ) {
d=parent.frames[n.substring(p+1 )].document; n=n.substring(0 ,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.fo rms.length;i++)
x=d.forms[i][n];
for(i=0;!x&&d.l ayers&&i<d.laye rs.length;i++)
x=findObj(n,d.l ayers[i].document);
if(!x && document.getEle mentById) x=document.getE lementById(n); return x;
}

</script>

place this in the body

<table>
<tr>
<td id="dynForm"><i nput type='text' id='field1' value='whatever '><input
type='button' value='add new' onClick='create NewInput()'></td>
</tr>
</table>


Simon







"Rosebud" <superchan777@y ahoo.com> wrote in message
news:c8f9a6fd.0 308211538.25179 755@posting.goo gle.com...[color=blue]
> Hello,
>
> I'd like some help trying to generate input fields on the fly. What I
> have on an HTML page is a single text input field labelled #1, e.g. #1
> <input type="text">. Next to the field is a button that, on click, I'd
> like to automatically generate a second text input field below the
> first, labelled #2. Everytime the button is clicked, another field is
> created with an incremented label.
>
> I explored iframes, but these text fields will be part of a larger
> form that has to be passed together. I'd rather not use hidden text
> fields because I don't want to hardcode a limit to the number of
> fields available. Please point me in the right direction, or let me
> know if this isn't possible.
>
> Thanks.[/color]

[Lasse Reichstein Nielsen]

Re: Dynamic input field generation

"steve stevo" <steve@stevoste ve.fsnet.co.uk> writes:

Please don't top post.
[color=blue]
> <script>[/color]

The type attribute is mandatory
<script type="text/javascript">

The "findObj" function appears to be a generic function. Quite
ingenious. Am I correct in deducing that an argument like
"elemName?frame Name" tries to find the element named "elemName" in the
sibling frame called "frameName" ?

It then tries to find the function using (in this order)
d[elemName]
d.all[elemName]
d.forms[i][elemName] (i ranging over all forms)
d.layers[i].* (i ranging over all layers, find recursively)
document.getEle mentById(elemNa me)

To be even better at finding elements in NS4, you could also search
through document.{links ,anchors,images ,forms,applets} (or what other
collections NS4 has available). I would test for document.getEle mentById
first, since more present browsers would be caught there.

[color=blue]
> function findObj(n, d) { //v4.0
> var p,i,x; if(!d) d=document;
> if((p=n.indexOf ("?"))>0&&paren t.frames.length ) {
> d=parent.frames[n.substring(p+1 )].document; n=n.substring(0 ,p);}
> if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.fo rms.length;i++)
> x=d.forms[i][n];
> for(i=0;!x&&d.l ayers&&i<d.laye rs.length;i++)
> x=findObj(n,d.l ayers[i].document);
> if(!x && document.getEle mentById) x=document.getE lementById(n); return x;[/color]

change "document.getEl ementById" to "d.getElementBy Id", or it won't find
elements in other frames in Mozilla.

/L
--
Lasse Reichstein Nielsen - lrn@hotpop.com
Art D'HTML: <URL:http://www.infimum.dk/HTML/randomArtSplit. html>
'Faith without judgement merely degrades the spirit divine.'