jQuery Set Checkbox Checked

jQuery set checkbox checked; Through this tutorial, i am going to show you how to set/check checkbox in html elements by id, name, etc, using jQuery prop() method.

jQuery Set Checkbox Checked

Using the jQuery prop () method; you can set/checked checkbox by it’s id, name, etc.

Syntax jQuery prop () method

$("selector").prop(property);

You can also set the value of a single property.

$("selector").prop(property, newValue);

It can also be done via a function.

$("selector").prop(property, function(index, currentValue));

Example – How to Set Checkbox Checked in jQuery

See the following example of the prop() method to checked checkbox dynamically with click on button by it’s id, name:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Check - Uncheck Checkbox Using prop</title>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script> 
<style type="text/css">
	.container{
    padding: 15px;
    background: #28BAA2;
    border: 1px solid #bead18;
}
</style> 
<script type="text/javascript">
$(document).ready(function(){
    $(".btn_check").click(function(){
        $("#checkVal").prop("checked", true);
    });
});
</script>
</head>
<body>
	<div class="container">
	<p><b>Note:</b> Click the button to checked checkbox in jQuery.</p> 
    <p><input type="checkbox" id="checkVal">Here is checkbox</p>
    <button type="button" class="btn_check">Checked</button>
	</div> 
</body>
</html>                            

Demo of How to Set Checkbox Checked in jQuery


Check – Uncheck Checkbox Using prop

Note: Click the button to checked checkbox in jQuery.

Here is checkbox


Recommended jQuery Tutorials

Be First to Comment

Leave a Reply

Your email address will not be published. Required fields are marked *