ItSolutionStuff.com

Check and Uncheck All Checkbox using JQuery Example

By Hardik Savani • January 30, 2023
HTML jQuery

Sometimes we need to Select and Deselect all checkboxes like you see on gmail if you check top checkbox then automatically select other all.So, we can do using jquery and its method prop().In Following example you can see how is that and use this example simply:

Example:

<html lang="en">

<head>

<title>Select and Deselect Checkbox</title>

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

</head>

<body>

<input name="subject_all" class="subject-all" type="checkbox">Select All<br/>

<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-all').on('change', function() {

if(this.checked){

$('.subject-list').prop('checked', true);

}else{

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

}

});

</script>

</body>

</html>

I hope it can help you...

Tags: jQuery
Hardik Savani

Hardik Savani

I'm a full-stack developer, entrepreneur, and founder of ItSolutionStuff.com. Passionate about PHP, Laravel, JavaScript, and helping developers grow.

📺 Subscribe on YouTube

We Are Recommending You

JQuery Remove All Numbers from String Example

Read Now →

How to Download File using JQuery?

Read Now →

How to use Laravel Variable in JQuery?

Read Now →

How to Remove Last Element from Array in JQuery?

Read Now →

JQuery Moment Get Current Date Example

Read Now →

How to Get Gravatar Image from Email using JQuery?

Read Now →

Preview an image before Upload using jQuery Example

Read Now →

How to Check If Element is Exists or Not in jQuery?

Read Now →

How to access PHP variables in JQuery?

Read Now →

How to Allow Only One Checkbox Checked at a Time in JQuery?

Read Now →

How to Check Undefined, Empty and Null in JQuery?

Read Now →

How to Convert Line Breaks to br in jQuery ?

Read Now →

How to Check Object is Empty or Not in JQuery?

Read Now →