Dynamic Field Value Not Submitting

[thody]

So, I have a form on my page, with a field that is generated on the fly with innerHTML. The field is being created just fine, the problem is that its value is not being submitted at all.

The field is created like this:
(inputfield is a table cell)

var inputfield = document.getElementById('inputfield');
inputfield.innerHTML = '<input name="q" type="text" id="q" size="25" />';


The field is created properly, but the value does not occur in the POST variables when the form is submitted (Yes the method of the form is POST).

Is there something I have to do to activate the field after it's created or something?

At first I thought perhaps the name wasn't being applied to the field, but after it's created I tried this, and it found the field, and printed alerted 'q':


var field = document.getElementById('q');
alert(field.name);

[BaldEagle]

vbrtrmn
Yeah .. you can't add forms with innerHTML, you need to create them in the DOM. Use something like this:

<form name="f" id="f">
</form>
<script type="text/javascript">
var d = document;
var f = document.getElementById('f');
var INPUT = d.createElement('INPUT');
f.appendChild(INPUT);
// add more attributes if you want...
INPUT.setAttribute('name','value');
// set the class name, class="blah" if you want.
INPUT.className = 'nameOfClass';
// add styles
INPUT.style.backgroundColor = 'blue';


I have not tested this code so you might have to experiment with it. This is not actually my code as I found it on another forum. The response was to the exact issue you are dealing with.

BaldEagle

[thody]

Yeah, I actually came across that after I left here. Eventually I realized I was getting far more complicated than necessary, and decided to just show/hide the fields with the display style and a little JS rather than messing around with DOM.