CODEWITHSUNDEEP
jquery
milesh
milesh

Reputation: 570

jquery radio group toggle on click

$("input[name=sample]").click(function(){
            $("#"+$(this).val()).show();
            $("#"+$("input[name=sample]:not(:checked)").val()).hide();
    });
});

I was using this for switching between two divs. But when i added a third div and radio button, this didn't work for third one. It shows on click but doesn't hide others. What can cause this?

Upvotes: 0

Views: 143

Answers (3)

adeneo
adeneo

Reputation: 318232

You now have more than one element to hide, so use something like :

$('input[name="sample"]').on('click', function(){
      $("#"+this.value).show();
      $("input[name=sample]:not(:checked)").each(function() {
          $('#'+this.value).hide();
      });
});

Upvotes: 0

Oliver
Oliver

Reputation: 9002

Hide each of the non selected elements:

$("input[name=sample]").click(function(){
    $("#"+$(this).val()).show();
        $("input[name=sample]:not(:checked)").each(index, item){
            $("#" + $(item).val()).hide();
        });
    });
});

Upvotes: 0

tymeJV
tymeJV

Reputation: 104775

Add a class to all your Div's, and hide that class before showing. (ex: class="divHide")

$("input[name=sample]").click(function(){
    $(".divHide").hide();
    $("#"+$(this).val()).show();
});

Upvotes: 1

Related Questions