Well, I don't use javascript all that much, and by that I mean, almost not at all. So I'm not sure how to do this, but I need to change the inputs of a form according to what is chosen with some radio buttons. I'll try to explain it more... There should be 4 radio buttons. And depending on which button is checked (Only one shall be checked of course.), the 3 input boxes on the bottom should remove or appear accordingly and the text explaining what they are should change too. Also, the radio buttons should still have a value sent. Hope I explained it easily enough.
Something like this? <html> <head> <script type="text/javascript"> function showBoxes() { // Find the index of the checked radio button var f = document.getElementById("form1"); for (var i=0; i<f.radiogroup.length; i++) { if (f.radiogroup[i].checked) break; } // Show or hide boxes if (i > 0) { document.getElementById("box1").style.visibility = "visible"; document.getElementById("text1").innerHTML = "Box 1 of 1: "; } else document.getElementById("box1").style.visibility = "hidden"; if (i > 1) { document.getElementById("box2").style.visibility = "visible"; document.getElementById("text1").innerHTML = "Box 1 of 2: "; document.getElementById("text2").innerHTML = "Box 2 of 2: "; } else document.getElementById("box2").style.visibility = "hidden"; if (i > 2) { document.getElementById("box3").style.visibility = "visible"; document.getElementById("text1").innerHTML = "Box 1 of 3: "; document.getElementById("text2").innerHTML = "Box 2 of 3: "; document.getElementById("text3").innerHTML = "Box 3 of 3: "; } else document.getElementById("box3").style.visibility = "hidden"; } </script> </head> <body onload="showBoxes()"> <form id="form1" action="#"> <input type="radio" id="radio1" name="radiogroup" value="value1" onclick="showBoxes();" /><label for="radio1">Show no boxes</label><br /> <input type="radio" id="radio2" name="radiogroup" value="value2" onclick="showBoxes();" /><label for="radio2">Show one box</label><br /> <input type="radio" id="radio3" name="radiogroup" value="value3" onclick="showBoxes();" /><label for="radio3">Show two boxes</label><br /> <input type="radio" id="radio4" name="radiogroup" value="value4" onclick="showBoxes();" checked="checked" /><label for="radio4">Show three boxes</label><br /> <p id="box1"><span id="text1">Box 1 of 3: </span><input type="text" id="input1" /></p> <p id="box2"><span id="text2">Box 2 of 3: </span><input type="text" id="input2" /></p> <p id="box3"><span id="text3">Box 3 of 3: </span><input type="text" id="input3" /></p> </form> </body> </html> Code (markup):