checkbox selet and delete
It performs:
1) On click of 'check all', select all checkboxes
2) On click of 'Uncheck all', unselect all checkboxes
3) Enable delete button on click of 'check all' or any one of checkbox
4) On click of delete, print the values of selected checkboxes
by Budhram Gurung
January 03, 2014
HTML
<input type="button" class="check" value="Check All" />
<input type="button" class="delete" value="Delete" disabled />
<br/>
<input type="checkbox" class="cb-element" value="1" />Checkbox 1
<br/>
<input type="checkbox" class="cb-element" value="2" />Checkbox 2
<br/>
<input type="checkbox" class="cb-element" value="3" />Checkbox 3
<br/>
JavaScript
$('.check:button').click(function () {
var checked = !$(this).data('checked');
$('input:checkbox').prop('checked', checked);
$('.delete:button').prop('disabled', !checked)
$(this).data('checked', checked);
if (checked == true) {
$(this).val('Uncheck All');
} else if (checked == false) {
$(this).val('Check All');
}
});
$('input:checkbox').change(function () {
$('.delete:button').prop('disabled', $('input:checkbox:checked').length == 0)
})
$('.delete:button').click(function () {
var array = $('input:checkbox:checked').map(function () {
return this.value
}).get();
console.log(array, array.join())
})