How to hide radio button based on status

Question

I have choice field called status, default is set to a value submitted. It has the following values. Save Submitted Rejected Approved

if save or submitted is selected the other two should be hidden. I have tried the below code.

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>

$(document).ready(function(){
//alert("load");
//Show/hide columns based on Choice Field Selection
 var status = $("input[name='ctl00$ctl38$g_affa1499_f8c3_4242_bbb3_57110a81fc84$ctl00$ctl05$ctl12$ctl00$ctl00$ctl04$ctl00$RadioButtons']:checked").val();
 alert(status);

if ($("select[title='Submitted']").val() != "Yes" || $("select[title='Submitted']").val() != '' )
{
alert("submitted");
$("select[title='Submitted']").hide();
$("select[title='Rejected']").style.visibility='hidden';
document.getElementByTitle('ctl00_ctl38_g_affa1499_f8c3_4242_bbb3_57110a81fc84_ctl00_ctl05_ctl12_ctl00_ctl00_ctl04_ctl00_ctl02').style.visibility='hidden';

$('nobr:contains("Rejected")').closest('tr').hide();
}
else
{
//$('nobr:contains("Field2")').closest('tr').show();
}
});
</script>

its not working.

Answer 1

Using F12 to check the radio button elements, we will find the values of the radio buttons are ctl00, ctl01, ctl02.... Please use F12 check your exact radio button values.

Then use this script:

<script src="https://code.jquery.com/jquery-1.10.2.min.js" type="text/javascript"></script>

<script language="javascript" type="text/javascript">

//In my “status” column, button values: Save-"ctl00" Submitted-"ctl01" Rejected-"ctl02" Approved-"ct103"

function hideOrShowOptions(){

                  var status = $("input[name$='ctl00$RadioButtons']:checked").val();

                  //alert(status);

                  if(status == "ctl00" || status == "ctl01"){

                                $(".ms-RadioText[title='Rejected']").closest("tr").css("display","none");

                                $(".ms-RadioText[title='Approved']").closest("tr").css("display","none");                               

                  } else {

                                $(".ms-RadioText[title='Rejected']").closest("tr").css("display","");

                                $(".ms-RadioText[title='Approved']").closest("tr").css("display","");          

                  }



}

$(document).ready( function() {

                hideOrShowOptions();

                $("input[name$='ctl00$RadioButtons']").change(function(){

                  hideOrShowOptions();

                });

});

</script>