Tuesday, December 4

How to get Checkboxlist value with comma Separator by jquery

                     Here I have explained How to get Checkboxlist value with comma Separator using  jquery  in asp.net.

Now here I will explain how you can get the values of checkboxlist using jQuery.As many you can get the output,for example if you check 3 checkboxes then you will get 3 outputs with comma separator.

To test this follow the below process.

·         First take one checkboxlist and one hiddenfield to store data as below
<asp:CheckBoxList CssClass="test" ID="ChkListPetsAllowed" runat="server">
<asp:HiddenField ID="hdnPetsAllowed" runat="server" />

·         Take any jquery plugin but I have taken following one
<script src="Scripts/jquery-1.7.1.min.js"></script>

·         Here is the Jquery function ,you just write like this you will get the output.
<script type="text/javascript">
jQuery("#<%=ChkListPetsAllowed.ClientID%>").click(function () {
var elementRef =
var checkBoxArray = elementRef.getElementsByTagName('input');
var checkedValues = '';
for (var i = 0; i < checkBoxArray.length; i++) {
var checkBoxRef = checkBoxArray[i];
if (checkBoxRef.checked == true) {
var labelArray =
if (labelArray.length > 0) {
if (checkedValues.length > 0)
checkedValues += ',';
checkedValues += labelArray[0].innerHTML.toString();
if (checkedValues == 'Other') {
args.IsValid = !(args.Value == "")
else {
args.IsValid = true;

I hope you will like this article.

Keep coding…
Thanks Shibashish Mohanty

No comments:

Post a Comment

Please don't spam, spam comments is not allowed here.

shibashish mohanty