Golang React JS Technology Blog

How to set checkbox and radio option checked on load with jQuery?

You can use prop function to set "checked" property: 
<script>
   $(document).ready(function()
   {
    $('#bar1').prop('checked', true);
    $('#radiobar1').prop('checked', true);  
   });
</script>
Working Example 
<!DOCTYPE html>
<html lang="en">
   <head>
      <style>	
         #hiddenElement {
         display: none;
         }
         #visibleElement {
         display: block;
         }
      </style>
      <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.js"></script>
      <script>
         $(document).ready(function()
         {
          $('#bar1').prop('checked', true);
          $('#radiobar1').prop('checked', true);  
         });
      </script>
   </head>
   <body>
      <div>
         <input type="checkbox" name="foo1" value="bar1" id="bar1" />
         <input type="checkbox" name="foo1" value="bar2" id="bar2" />
         <input type="checkbox" name="foo1" value="bar3" id="bar3" />
      </div>
      <div>
         <input type="radio" name="foo2" value="bar1" id="radiobar1" />
         <input type="radio" name="foo2" value="bar2" id="radiobar2" />
         <input type="radio" name="foo2" value="bar3" id="radiobar3" />
      </div>
   </body>
</html>
Most Helpful This Week
JavaScript HTML5 Validation for name and email field How to declare and print value of variable in JavaScript? How to change text color on click using JavaScript? How to scroll page to particular Div on click using jQuery? jQuery move multi select values from one to another multi select list Write a function that splits an array into groups the length of size and returns them as a two-dimensional array