Dear friends

Can anyone pls help me with this

I need to create radio buttons where 1st option will have 2 sub options as shown below

1)Closely held company

Sole Proprietor
Family owned

2)Public company with minority float
3)Public company with majority float

If the user selects "Closely held Company" then he should be able to select either "sole Prop" or "family owned" or he can even not select any suboptions
But if he selects any one of the suboptions then "Closely held Company" should be selected automatically.

Pls help me.

Recommended Answers

All 3 Replies

Member Avatar for iamthwee

Dear friends

Can anyone pls help me with this

I need to create radio buttons where 1st option will have 2 sub options as shown below

1)Closely held company

Sole Proprietor
Family owned

2)Public company with minority float
3)Public company with majority float

If the user selects "Closely held Company" then he should be able to select either "sole Prop" or "family owned" or he can even not select any suboptions
But if he selects any one of the suboptions then "Closely held Company" should be selected automatically.

Pls help me.

There's a few conditions there. Perhaps you would be better designing that on the server side, via php?

you should better use select and optgroup:

<select name="abc">
    <optgroup label="Closely held company">
        <option value="..">Sole Proprietor</option>
        <option value="..">Family owned</option>
    </optgroup>
    <option value="..">Public company with minority float</option>
    <option value="..">Public company with majority float</option>
</select>

anyway, if you urgently need a radio-input-solution, you might use something like this:

<input type="radio" name="type0" onchange="checkSub(this, 'sub', 'type1');" checked="checked" /> Closely held company
<div id="sub" style="padding-left: 20px">
    <input type="radio" name="type1" value=".." checked="checked" /> Sole Proprietor<br />
    <input type="radio" name="type1" value=".." /> Family owned<br />
</div>
    
<input type="radio" name="type0" onchange="disableSub('sub')" value=".." />Public company with minority float<br />
<input type="radio" name="type0" onchange="disableSub('sub')" value=".." />Public company with majority float

<script type="text/javascript">
<!--
    function checkSub(sup, name) {
        var bDisable= sup== false|| !sup.checked;
        var s= document.getElementById(name), i= 0, node= null, bCheck= false, nFirst= null;
        if (!s) return; else s= s.childNodes;
        while (n= s.item(i++))
            if (n.nodeName== 'INPUT' && n.type== 'radio') {
                if (n.checked) bCheck= n.checked; // -- set one has been checked
                if (!nFirst) nFirst= n; // -- mark first
                n.disabled= bDisable; // -- set disabled?
            }
        if (!bDisable && !bCheck && nFirst) // -- check first, if neccessary
            nFirst.checked= true;
    }
    
    function disableSub(name) {
        for (var i= 0; i< arguments.length; i++)
            checkSub(false, name);
    }
    
//-->
</script>

some mistake, function disableSub :

..
    function disableSub() {
        for (var i= 0; i< arguments.length; i++)
            checkSub(false, arguments[i]);
    }
    ..
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.