How to get the check box click event fired in Jquery document ready function?

Question

In the document.ready function, alert is throwing an undefined error message. On this check box selection, I will have to enable or disable radio button controls.

How to validate, whether checkbox : other is checked or not?

$(document).ready(function () 
{
  $("#Other").on("click", function ()
    {
       // On this check box click event, i will have to enable radio buttons 
       document.getElementById('Yes').disabled = false;
       document.getElementById('No').disabled = false;
    });
});

Answer 1

To fire click event on document.ready you need to trigger the click event that you have defined on element.

$(document).ready(function() {
    $("#Other").on("click", function() {
        alert($(this).val());
    });
    $("#Other").trigger("click");
});

in the above click event on #Other has been defined.

 $(document).ready(function() { $("#Other").on("click", function() { alert($(this).val()); }); $("#Other").trigger("click"); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input id="Other" type="checkbox" value="Hello World">checkbox 

To check if the check box is checked or not you can do

if ($("#Other").is(":checked")) {
    // do something if the checkbox is checked
}

 $(document).ready(function() { if ($("#Other").is(":checked")) { $('input[type="radio"]').prop('checked', true); } else { $('input[type="radio"]').prop('checked', false); } }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input id="Other" type="checkbox" value="Hello World" checked>checkbox1 <br> <input type="radio" name="gender" value="radio"> radio<br> 

To check and uncheck the checkbox your code looks like:

 $(document).ready(function() { $("#Other").on("click", function() { if ($(this).is(":checked")) { $('input[type="radio"]').prop('checked', true); } else { $('input[type="radio"]').prop('checked', false); } }); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input id="Other" type="checkbox" value="Hello World">checkbox1 <br> <input type="radio" name="gender" value="radio"> radio<br> 

To enable and disable radio button you can add disable attribute.

 $(document).ready(function() { $("#Other").on("click", function() { enblDsblChkb($(this)); }); enblDsblChkb($("#Other")); function enblDsblChkb($elem){ if ($elem.is(":checked")) { $('input[type="radio"]').prop('disabled', false); } else { $('input[type="radio"]').prop('disabled', true); } } }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input id="Other" type="checkbox" value="Hello World">checkbox1 <br> <input type="radio" name="gender" value="yes"> Yes<br> <input type="radio" name="gender" value="no"> No<br>