Originally posted @ https://codeanddeploy.com visit and download the sample code: https://codeanddeploy.com/blog/jquery/how-to-uncheck-and-check-a-radio-button-using-javascriptjquery
Advanced Laravel SAAS Starter Kit with CRUD Generator - GET YOUR COPY NOW!
In my previous post, I share how to uncheck the radio button now I will share with you how to switch the radio button to uncheck and check using the click button event in javascript/jquery. To see the sample out kindly see below.
Before
After
Example code
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>How to unchecked a radio button using JavaScript/jQuery?</title> </head> <body> <h1>How to unchecked a radio button using JavaScript/jQuery?</h1> <form id="form1"> <p><b>Current Status</b></p> <input type="radio" value="1" name="status" class="status" checked> Active <br/><br/> <button type="button" id="btnSubmit">Deactivate</button> </form> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script type="text/javascript"> $(document).ready(function() { $("#btnSubmit").on("click", function() { var button = $(this); var status = $(".status"); if(status.is(":checked")) { status.prop("checked", false); button.html("Activate"); } else { status.prop("checked", true); button.html("Deactivate"); } }); }); </script> </body> </html> I hope this tutorial can help you. Kindly visit here https://codeanddeploy.com/blog/jquery/how-to-uncheck-and-check-a-radio-button-using-javascriptjquery if you want to download this code.
Advanced Laravel SAAS Starter Kit with CRUD Generator - GET YOUR COPY NOW!
Happy coding :)
Top comments (0)