Search code examples
jqueryradiobuttonlist

Radio Buttons jQuery


I'm trying to show a div with input fields of a radio button choice, Yes or No.

HTML

<input id='companyreg' name='companyreg' class='radio' type='radio' value='yes' /> Yes
<input id='companyreg' name='companyreg' class='radio' type='radio' value='no' /> No

The Jquery

var compfieldset = $("#companyfieldset");
//if javascript hide comp field
compfieldset.hide();
$("#companyreg").click(function(){
    var value = $("input[@name=companyreg]:checked").val();
    if (value === "yes") {
        compfieldset.slideDown();
    }
    if (value != "yes") {
        compfieldset.slideUp();
    }
});

Please can you help me out guys.

EDIT

Sorry.

When I click on No, nothing happens.

If I click on yes, the fieldset shows.


Solution

  • You cannot have two elements in the same document with the same ID. Your selector, #companyreg, is finding the first element and not the second. If you were to check the

    $("#companyreg").length
    

    you'd see 1.

    You could probably get past this by using

    $( '[id="companyreg"]' )
    

    though it wouldn't fix your invalid document. The best way would be to remove the ID and add a class to those elements, then select via that class.

    I have't checked the rest of your code to see if that's the only issue, but I suspect it's the biggest one.