Skip to content Skip to sidebar Skip to footer
Home / Button / Dhtml / Javascript / Radio

Linked Dynamic Radio Buttons Html Javascript

Post a Comment
All, Have used this site a few times before and had some great replies so hopefully someone can help again. I want a set of radio buttons, so that when you click a button - you get

Solution 1:

Radio input elements are grouped by their name attribute. You should assign a different name to the other sets of radio input elements.

Visual example:

[x]name=favColor   [ ] name=favRed
[ ]name=favColor   [x] name=favRed
[ ]name=favColor   [ ] name-favRed

See also: https://developer.mozilla.org/en/HTML/Element/input

Solution 2:

Your if statement is wrong. You ask again and again this: if (question=="yes") h1.style.display="block"; else h1.style.display="none"; and the second time if is not true, so you set the h1 to be hidden.

here is one solution:

<html><head><title>My Wizard</title><scriptlanguage="javascript">functionDisplay(question, i) {
        h1=document.getElementById("yes");
        h2=document.getElementById("no");
        h3=document.getElementById("dk");
        h4=document.getElementById("yes2");

        if(i==1){
            if (question=="yes") h1.style.display="block";
                else h1.style.display="none";
            if (question=="no") h2.style.display="block";
                else h2.style.display="none";
        }elseif(i==2){
            if (question=="dk") h3.style.display="block";
                else h3.style.display="none";
            if (question=="yes2") h4.style.display="block";
                else h4.style.display="none";
        }
}
</script></head><body><hr><formname="form1"><p>Do you like the colour blue?</p><inputtype="radio"name="type"value="yes"checkedonClick="Display('yes', 1);">
        Yes

        <inputtype="radio"name="type"value="no"onClick="Display('no', 1);">
        No

        <inputtype="radio"name="type"value="dk"onClick="Display('dk', 1);">
        Don't know

<br><divID="yes"style="display:none;"><hr><p>Do you like the colour red?</p><inputtype="radio"name="type"value="yes2"checkedonClick="Display('yes2', 2)">
        Yes

        <inputtype="radio"name="type"value="no2"onClick="Display('no2', 2);">
        No

</div><divID="yes2"style="display:none">
I want this to appear beneath the 2nd set of buttons, not replacing it!
</div><divID="no2"style="display:none">
test2
</div><divID="no"style="display:none"><b>this is my no box:</b><inputtype="text"name="no"size="25"></div><divID="dk"style="display:none"><b>dk:</b><inputtype="text"name="dk"size="15"></div></form></body></html>

You may like these posts

Post a Comment for "Linked Dynamic Radio Buttons Html Javascript"