PDA

View Full Version : Create a certain amount of input boxes based on a radiobutton selection in a form.

dbooysen72
10-16-2002, 02:32 PM
How do I create a certain amount of input boxes based on a radiobutton selection in a form which I need to submit?
Example:
Radio button "3 people" selected. 3 input boxes will appear where I can fill in the names of 3 people and submit the form.

Radio button "6 people" selected. 6 input boxes will appear where I can fill in the names of 6 people and submit the form and so on.

Please help.
beetle
10-16-2002, 03:07 PM
something like this?<html>
<head>
<title>form stuff</title>
<style>
body { font-family: arial, helvetica, sans-serif; font-size: 12px; background-color: #ffffff; color: #000000; }
</style>
<script>
function doFields(v,oID) {
var o = document.getElementById(oID);
removeChildren(o);
for (var i=1; i<=v; i++) {
var label = document.createTextNode("Name #"+i+" ");
var inp = document.createElement("INPUT");
inp.setAttribute("type","text");
inp.setAttribute("name","Name_"+i);
inp.setAttribute("id","Name_"+i);
var br = document.createElement("BR");
o.appendChild(label);
o.appendChild(inp);
o.appendChild(br);
}
}
function removeChildren(node) {
var l = node.childNodes.length;
for (var i=0; i<l; i++)
node.removeChild(node.firstChild);
}
</script>
</head>

<body>
<form>
Number of People?<br>
1<input type="radio" name="people" value="1" onClick="doFields(this.value,'inputs')"><br>
2<input type="radio" name="people" value="2" onClick="doFields(this.value,'inputs')"><br>
3<input type="radio" name="people" value="3" onClick="doFields(this.value,'inputs')"><br>
4<input type="radio" name="people" value="4" onClick="doFields(this.value,'inputs')"><br>
5<input type="radio" name="people" value="5" onClick="doFields(this.value,'inputs')"><br>
6<input type="radio" name="people" value="6" onClick="doFields(this.value,'inputs')"><br>
<hr>
<div id="inputs">
</div>
</form>
</body>
</html>