Question

Below, the javascript function testit2() will show whether or not there is a selection for each of the four groups of radio buttons in the div1 div when you click the Test button. But if the display style for one of the groups is "none" then it fails because I can't make a selection from that group. How do I add that the buttons must be visible (i.e., the display style is inline or the visibility style is visible).

<script type="text/javascript">
function testit2()
{
    var radioscomplete = true;
    $('input:radio', $('#div1')).each
    (
        function()
        {
            name = $(this).attr('name');
            if(! $('input:radio[name="' + name + '"]:checked').length)
            {
                alert('Oops, you missed some input there.. [' + name + ']');
                radioscomplete = false;
                return false;
            }
        }
    );
    if (radioscomplete)
        alert("All checked");
}


</script>
</head>
<body>
<div id="div1">
<input type="radio" name="xyz">test1<br />
<input type="radio" name="xyz">test4<br />
<input type="radio" name="xyz1">1test1<br />
<input type="radio" name="xyz1">1test4<br />
<input type="radio" name="xyz2">2test1<br />
<input type="radio" name="xyz2">2test4<br />
<span style="display:inline;"><input type="radio" name="xyz3">3test4<br /></span>

<br>
<button onclick="testit2();">Test</button>
</div>
Was it helpful?

Solution

You mean

$('input:radio:visible')

?

or use

.filter(':visible:checked')
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top