In this post we can see how to show or hide certain form fields when a radio button selection happen in your web form using jquery. To do this you need a different DIV associated with that radio button to hide or show certain fields in the form. You can achive this very easily and efficiently using jquery.
Just put a click function to the radio button group $(“input[name$=’type’]”).click and then get the value var radio = $(this).val() of the radio button. Once get the value of the radio button using the ID of the DIV simply hide() or show() .
Below is the complete script used in the demo
<script>
$(document).ready(function(){
$("input[name$='type']").click(function(){
var radio = $(this).val();
if(radio=='Individual') {
$("#Individual_box").show();
$("#Company_box").hide();
}
else if(radio=='Company') {
$("#Company_box").show();
$("#Individual_box").hide();
}
});
$("#Individual_box").show();
$("#Company_box").hide();
});
</script>
