Monday, September 16, 2013
Selecting chechboxes via Javascript
Hiiii,
Sometimes it happens that we want to perform a same action like delete
on many records of the table in html , so to do this we require a
checkboxes to select records on which action is to be performed. So, In
this post I'll give you the tutorial of how to select all the checkboxes
by just selecting a header checkbox or by manually selecting
checkboxes.
Here's the code below :
Creating a Checkbox HTML :
<table id=”table_name”><thead>
<tr>
<th><input type=’checkbox’ id=”check_all”></th>
</tr>
</thead>
<tbody>
<tr> <td><input type=”checkbox” name=”ids[]” value=”some id like 1,2,etc”></td> </tr>
</tbody>
</table>
Javascript code to select all checkboxes :
$( document ).on(“click”, “#check_all”,function() {var checkedStatus = this.checked;
$(‘#table_name tbody tr’).find(‘td:first :checkbox’).each(function () {
$(this).prop(‘checked’, checkedStatus);
});
});
Getting array of ids of checkboxes selected :
$( document ).on(“click”, “#button_id”,function() {var ids_arr = [];
$(“[name='ids[]‘]:checked”).each(function() {
ids_arr.push(this.value);
});
});
This ids_arr array you are getting is the array of ids checked/ selected. You have to pass this array to the next page through ajax where function or database queries to do with the selected ids is written.
To see How to send data on next page or same page through Ajax , CLICK HERE
Hope you like this post……..Please Comment....!!!!!!
Originally posted at Mycodestock.
Tags: HTML , Javascript/Jquery
Subscribe to:
Post Comments (Atom)
0 Responses to “Selecting chechboxes via Javascript”
Post a Comment