In this article I will explain how to select a group of checkboxes using jQuery.
The following example can represent in general the common techniques used to select more than an element at once.
This post is related with the post called sandorBlog(Dynamic Table) for explain how to check all input checkbox from a table with only one action.
.how to check all checkboxes at once
jQuery gives us a very easy tools to select and change the properties of an elements
.basic jQuery structure
-
$(document).ready()
The code will only run once the page (DOM) is ready to execute. -
$(selector).action()
Listen the trigger action of the selected element. If the action is triggered than the code will be executed.
.select all checkbox and change their status
-
$(this)
The element itself that triggers the event -
.prop('checked')
Get the status of the element property. For the "checked" property the .prop() function will return a Boolean value. -
.prop('checked', true)
Set the status of the element property. In this case, the property element "checked" status will be set as "true". -
<input type="checkbox" id="checkbox-5" name="checkboxTable" class="checkbox">
Input checkbox example.
ID | Name | Selector list examples: | |||
---|---|---|---|---|---|
5 | Lilyan |
|
|||
11 | Marley |
|
|||
45 | Mary |
|
|||
14 | Alden |
|
|||
16 | Veda |
|
|||
23 | Demetris |
|
|||
66 | Juan |
|
|||
26 | Seth |
|
|||
31 | Halle |
|
|||
8 | April |