...

View Full Version : Dynamic Form



afrojojo
01-09-2007, 10:19 PM
I would appreciate it if one of you lads could give me some javascript code.

I would like to have a form that starts out with two radio buttons. If one is checked, two text box fields appear below it. If the other one is checked, two different text boxes appear below.

Thanks

TripperTreats
01-10-2007, 12:31 AM
head javascript:

function showFirst () {
document.getElementBy('text1').style.display="";
document.getElementBy('text2').style.display="";
document.getElementBy('text3').style.display="none";
document.getElementBy('text4').style.display="none";
}

function showLast () {
document.getElementBy('text1').style.display="none";
document.getElementBy('text2').style.display="none";
document.getElementBy('text3').style.display="";
document.getElementBy('text4').style.display="";
}HTML:

<form>
<label for="first" onclick="showFirst()"><input type="radio" id="first" /></label>
<label for="last" onclick="showLast()"><input type="radio" id="last" /></label>
<input type="text" style="display:none" id="text1" />
<input type="text" style="display:none" id="text2" />
<input type="text" style="display:none" id="text3" />
<input type="text" style="display:none" id="text4" />
</form>

afrojojo
01-10-2007, 05:14 AM
head javascript:

function showFirst () {
document.getElementBy('text1').style.display="";
document.getElementBy('text2').style.display="";
document.getElementBy('text3').style.display="none";
document.getElementBy('text4').style.display="none";
}

function showLast () {
document.getElementBy('text1').style.display="none";
document.getElementBy('text2').style.display="none";
document.getElementBy('text3').style.display="";
document.getElementBy('text4').style.display="";
}HTML:

<form>
<label for="first" onclick="showFirst()"><input type="radio" id="first" /></label>
<label for="last" onclick="showLast()"><input type="radio" id="last" /></label>
<input type="text" style="display:none" id="text1" />
<input type="text" style="display:none" id="text2" />
<input type="text" style="display:none" id="text3" />
<input type="text" style="display:none" id="text4" />
</form>

I tried that, it doesn't work.

Philip M
01-10-2007, 08:29 AM
Change every instance of
document.getElementBy

to:-
document.getElementById



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum