Friday, May 17, 2013

How to hide fields based in selection of radio button using java script

SharePoint generates a HTML code for the New/Edit/Display Page for each created list.

Now you have to the following java script code in your desire page to hide the field

Assume the html code is as follow:

<input type="radio" name="Internal Person" id="Person Type" value="ctl001">Internal Person</input> 
<input type="radio" name="External Person" id="Person Type" value="ctl002" >Invoiced</input>


The above code displays 2 radio button. Now you want to hide

var newVal = $(':radio[name=Reported By]:checked').val();
if (newVal == "ctl001")
{
       $('nobr:contains("Internal Reporter Name")').closest('tr').show();
       $('nobr:contains("External Reporter Name")').closest('tr').hide();
}
else
{
       $('nobr:contains("Internal Reporter Name")').closest('tr').hide();
       $('nobr:contains("External Reporter Name")').closest('tr').show();            
}

1 comments: