Friday, September 10, 2010

Handling the multiple checkboxes with Jquery for Check All, Uncheck All and get values from selected values V2

Handling the multiple checkboxes with jquery for Check All, Uncheck All
and get values from selected values. V2 For new versions of Jquery.


include jquery

<script language="JavaScript" src="youserveraddres/js/jquery.js"></script>


your html

<input name="phpqa[]" type="checkbox" value="1">1
<input name="phpqa[]" type="checkbox" value="2">2
<input name="phpqa[]" type="checkbox" value="3">3
<input name="phpqa[]" type="checkbox" value="4">4
<input name="phpqa[]" type="checkbox" value="5">5
<input name="phpqa[]" type="checkbox" value="6">6
<input name="phpqa[]" type="checkbox" value="7">7
<input name="phpqa[]" type="checkbox" value="8">8

<a href="javascript:void();" onclick="markAll()">Check All</a>
<a href="javascript:void();" onclick="unMarkAll()">Uncheck All</a>
<a href="javascript:void();" onclick="getSelectedVals()">Get Checked Values</a>


// function for mark all / check all

function markAll(){
$("input[name='phpqa[]']").each(function() {
this.checked = true;
});
}


// function for uncheck all

function unMarkAll(){
$("input[name='phpqa[]']").each(function() {
this.checked = false;
});
}


//fetching selected values / checked values

function getSelectedVals(){
$("input[name='phpqa[]']").each(function() {
if ($(this).attr('checked'))
{
alert($(this).val());
}
});
}