Category >
ASP.NET
|| Published on :
Tuesday, January 15, 2019 || Views:
7463
||
Get multiple selected (checked) CheckBox value Comma Separated String using jQuery
Introduction
Here Pawan Kumar will explain how to Get multiple selected (checked) CheckBox values as Comma Separated String using jQuery
Description
Now I will explain How to Get multiple selected (checked) CheckBox values as Comma Separated String using jQuery
So follow the steps to learn Get multiple selected (checked) CheckBox values as Comma Separated String using jQuery
Default.htm
<!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>
<title>Get multiple selected (checked) CheckBox values as Comma Separated String using jQuery</title>
<style type="text/css">
body
{
font-family: Arial;
font-size: 10pt;
}
</style>
</head>
<body>
<table id="tblCars">
<tr>
<td><input id="chkAstonMartin" type="checkbox" value="1"/><label for="chkAstonMartin">Aston Martin</label></td>
</tr>
<tr>
<td><input id="chkAudi" type="checkbox" value="2"/><label for="chkAudi">Audi</label></td>
</tr>
<tr>
<td><input id="chkBMW" type="checkbox" value="3"/><label for="chkBMW">BMW</label></td>
</tr>
<tr>
<td><input id="chkCadillac" type="checkbox" value="4"/><label for="chkCadillac">Cadillac</label></td>
</tr>
<tr>
<td><input id="chkChevrolet" type="checkbox" value="5"/><label for="chkChevrolet">Chevrolet</label></td>
</tr>
</table>
<br />
<input type = "button" id = "btnGet" value = "Get" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
$("#btnGet").click(function () {
//Create an Array.
var selected = new Array();
//Reference the CheckBoxes and insert the checked CheckBox value in Array.
$("#tblCars input[type=checkbox]:checked").each(function () {
selected.push(this.value);
});
//Display the selected CheckBox values.
if (selected.length > 0) {
alert("Selected values: " + selected.join(","));
}
});
});
</script>
</body>
</html>
Conclusion:
So, In this tutorial we have learned, Get multiple selected (checked) CheckBox values as Comma Separated String using jQuery