In my asp.net application, I have a checkbox list that is defined as follows:
<asp:CheckBoxList ID="chbUserType" RepeatDirection="Horizontal" runat="server">
</asp:CheckBoxList>
I have populated this checkbox list using the following code:
chbUserType.DataSource = dtRoles;
chbUserType.DataValueField = "idRole";
chbUserType.DataTextField = "Title";
chbUserType.DataBind();
foreach (ListItem li in chbUserType.Items)
{
li.Attributes.Add("JSvalue", li.Value);
}
Now, I need to access the selected values of this checkbox list in JavaScript.
For this purpose, I have written the following code snippet:
var userType = "";
var chkBox = document.getElementById('<%=chbUserType.ClientID %>');
var options = chkBox.getElementsByName('input');
var listOfSpans = chkBox.getElementsByTagName('span');
for (var i = 0; i < options.length; i++) {
if (options[i].checked) {
if (i != options.length - 1) {
userType = listOfSpans[i].attributes["JSvalue"].value + ",";
}
else {
userType = listOfSpans[i].attributes["JSvalue"].value;
}
}
}
alert(userType);
However, when I run this code, I am not seeing any values in the alert. Can someone please guide me on how to achieve this?
Edit 2 :
Generated HTML
<span jsvalue="2"><input id="MainContent_chbUserType_1" type="checkbox" name="ctl00$MainContent$chbUserType$1" value="2"><label for="MainContent_chbUserType_1">Dispatcher</label></span>