Submitting FORM with dynamically created INPUTs?

[Cronos]

Hi.

I'm trying to submit (to PHP) a FORM with dynamically created INPUTs, but my INPUTs do not propagate.

What is wrong?

function write() {
target = document.getElementById('formsml');
spn = document.createElement('span');
txt = document.createTextNode(i);
lk = document.createElement('input');
lk.setAttribute('type', 'button');
lk.setAttribute('value', 'ny button');
lk.setAttribute('name', i); i++;
spn.appendChild(txt);
spn.appendChild(lk);


target.appendChild(spn);

}

HTML:

<form id="formsml" name="smli" method="post" action="form4.php?step=1">
<input type="button" onclick=write() name="klikknapp" value="lkdfj">
<div id="her"></div>
<INPUT type="checkbox" name="Debug" CHECKED>
<input type="submit" name="submit" VALUE="[COMMIT]>
</form>

No matter how many INPUTs I add via my function, the only two that comes through to the PHP file are "Debug" and "submit".

Anyway, what I'm trying to do is to fill up a "box" (DIV) with user input (1-30+ elements) and then submit that to a DB nicely.

[Nile]

In your HTML, you forgot to put in the last double quote:

<form id="formsml" name="smli" method="post" action="form4.php?step=1">
<input type="button" onclick=write() name="klikknapp" value="lkdfj">
<div id="her"></div>
<INPUT type="checkbox" name="Debug" CHECKED>
<input type="submit" name="submit" VALUE="[COMMIT]">
</form>

[Cronos]

Yes, thanks for pointing that out.
However, it's still not working.

[BYK]

I do not think that buttons' values are submitted. Can you try setting the type to text or hidden?

[Master_script_maker]

give your submit button an id of "submit".

function write() {
target = document.getElementById('formsml');
submit = target.getElementById("submit");
spn = document.createElement('span');
txt = document.createTextNode(i);
lk = document.createElement('input');
lk.setAttribute('type', 'button');
lk.setAttribute('value', 'ny button');
lk.setAttribute('name', i); i++;
lk.setAttribute('id', "input_"+i-1);
spn.appendChild(txt);
//spn.appendChild(lk);

//target.appendChild(spn);

target.insertBefore(lk,submit);
target.insertBefore(spn,lk);
}

[Cronos]

Thanks, guys. You are absolutely right. Buttons are not submitted. I only used buttons for testing purposes (it was easy to write), and could not understand why it didn't work.

Also, I found out that FORM is picky about where you put the INPUTs for submitting.
A DIV inside a DIV would not work. However, a single no-fuzz DIV is allowed.

I didn't see this anywhere when reading about FORMs.

This did not work (target is "a-output"):


<form>
...
<div id="fourth" class="row">
<div class="input">
<input type="text" id="a-input">
</div>
<div class="output" id="a-output">
</div>
<br class="clear">
</div>
...
</form>


And this did work:


<form>
...
<div id="content"><div>
...
</form>