Skip to content

Instantly share code, notes, and snippets.

@Muhammed-Rahif
Last active April 15, 2021 04:06
Show Gist options
  • Save Muhammed-Rahif/f9a82c60e050ff897a202e94496f3972 to your computer and use it in GitHub Desktop.
Save Muhammed-Rahif/f9a82c60e050ff897a202e94496f3972 to your computer and use it in GitHub Desktop.
Get multiple selected (checked) CheckBox values in Array using jQuery
<table id="tblFruits">
<tr>
<td><input id="chkMango" type="checkbox" value="mango"/><label for="chkMango">Mango</label></td>
</tr>
<tr>
<td><input id="chkApple" type="checkbox" value="apple"/><label for="chkApple">Apple</label></td>
</tr>
<tr>
<td><input id="chkBanana" type="checkbox" value="banana"/><label for="chkBanana">Banana</label></td>
</tr>
<tr>
<td><input id="chkGuava" type="checkbox" value="guava"/><label for="chkGuava">Guava</label></td>
</tr>
<tr>
<td><input id="chkOrange" type="checkbox" value="orange"/><label for="chkOrange">Orange</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.
$("#tblFruits 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>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment