[Javascript] [SOLVED] JS Help: Dynamic form control
Michael Hulse
micky at ambiguism.com
Sun Mar 5 04:59:44 CST 2006
Actually, I just got it my code working by doing this:
<snip>
var counter = 0;
function moreFields() {
counter++;
var newFields = document.getElementById('readroot').cloneNode(true);
newFields.id = '';
newFields.style.display = 'block';
newFields.firstChild.nodeValue=counter + '. ';
changeId(newFields, counter);
var insertHere = document.getElementById('writeroot');
insertHere.parentNode.insertBefore(newFields,insertHere);
}
function delField() {
var writeroot = document.getElementById('writeroot');
if(counter >= 1) {
writeroot.parentNode.removeChild(writeroot.previousSibling);
counter--;
}
}
function changeId(r, c) {
var rKids = r.getElementsByTagName('*');
var i = rKids.length;
var rKid;
while(i--) {
rKid = rKids[i];
if (rKid.id) rKid.id = rKid.id + c;
if (rKid.name) rKid.name = rKid.name + c;
}
}
//setTimeout(moreFields, 100);
/*window.onload = moreFields;*/
event_attach('onload', moreFields);
</snip>
XHTML:
<snip>
<div id="readroot" style="display: none">
<div class="fm-req">
<label for="item_">* Item name:</label>
<input name="item_" id="item" type="text" title="Item name" />
</div>
<div class="fm-req">
<label for="product_">* Product #:</label>
<input name="product_" id="product" type="text" title="Product
number" />
</div>
<div class="fm-opt">
<label for="quantity_">Quantity desired:</label>
<input name="quantity_" id="quantity" type="text" title="Desired
quantity" />
</div>
<input class="fm-remove" id="remove" type="button" value="Remove Item"
onclick="delField();" />
<div class="horizRule"></div>
</div>
</snip>
Above seems to work... not yet fully tested.
Thanks again for help.
Cheers,
Micky
-------------- next part --------------
A non-text attachment was scrubbed...
Name: not available
Type: text/enriched
Size: 2111 bytes
Desc: not available
URL: <http://lists.evolt.org/pipermail/javascript/attachments/20060305/72e8b1de/attachment.bin>
More information about the Javascript
mailing list