Select only one checkbox at a time using Jquery

By Hardik Savani | February 5, 2016 | | 90435 Viewer | Category : Javascript HTML jQuery


If you need to select one checkbox at a time in multiple checkbox, i mean you want to allow anly one checkbox user can check then you can do easily using jquery. jquery prop() through you can give attribute value checked equel to true or false.

if you have banch of checkbox like as example, and if you want to check checkbox at time one by using jquery then you can use this code. In following example use for you to do select at a time one.

Example:

<html>

<head>

<title>Select only one checkbox at time</title>

<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>

</head>

<body>

<input value="1" name="subject" class="subject-list" type="checkbox">Subject 1

<input value="2" name="subject" class="subject-list" type="checkbox">Subject 2

<input value="3" name="subject" class="subject-list" type="checkbox">Subject 3

<input value="4" name="subject" class="subject-list" type="checkbox">Subject 4

<input value="5" name="subject" class="subject-list" type="checkbox">Subject 5

<script type="text/javascript">

$('.subject-list').on('change', function() {

$('.subject-list').not(this).prop('checked', false);

});

</script>

</body>

</html>



Hardik Savani
My name is Hardik Savani. I'm a full-stack developer, entrepreneur and owner of Aatman Infotech. I live in India and I love to write tutorials and tips that can help to other artisan. I am a big fan of PHP, Javascript, JQuery, Laravel, Codeigniter, VueJS, AngularJS and Bootstrap from the early stage.
***Do you want me hire for your Project Work? Then Contact US.