Here Full Example
How TO Get All Checkbox value Using It's class
Checked Checkbox Value Using Class In Jquey
We can use on change event for every checkbox and getting value of it class.
use push to collect value check it.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Checkbox Value Example</title>
</head>
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script type="application/javascript">
function getValueUsingClass(){
/* declare an checkbox array */
var chkArray = [];
/* look for all checkboes that have a class 'chk' attached to it and check if it was checked */
$(".chk:checked").each(function() {
chkArray.push($(this).val());
});
/* we join the array separated by the comma */
var selected;
selected = chkArray.join(',') + ",";
/* check if there is selected checkboxes, by default the length is 1 as it contains one single comma */
if(selected.length > 1){
alert("You have selected " + selected);
}else{
alert("Please at least one of the checkbox");
}
}
</script>
<body>
<input type="checkbox" class="chk" name="test" value="checked1" onchange="getValueUsingClass()" />checked1
<input type="checkbox" class="chk" name="test" value="checked2" onchange="getValueUsingClass()" />checked2
<input type="checkbox" class="chk" name="test" value="checked3" onchange="getValueUsingClass()" />checked3
<input type="checkbox" class="chk" name="test" value="checked4" onchange="getValueUsingClass()" />checked4
<input type="checkbox" class="chk" name="test" value="checked5" onchange="getValueUsingClass()" />checked5
<input type="checkbox" class="chk" name="test" value="checked6" onchange="getValueUsingClass()" />checked6
<input type="checkbox" class="chk" name="test" value="checked7" onchange="getValueUsingClass()" />checked7
</body>
</html>
No comments:
Post a Comment
Thank You For Comment