CODEWITHSUNDEEP
javascriptasp.netcheckboxlist
njj56
njj56

Reputation: 621

Can not get value of checked items in checkboxlist via javascript

in my application I have a checkbox list. Listed below is the html for the checkbox list, as well as the vb code that bind it on load of the page it is located on.

<asp:CheckBoxList Runat="server" id="chklistTeams" RepeatColumns="7" RepeatDirection="Horizontal"
                        CellPadding="4" Font-Size="7pt"></asp:CheckBoxList>

Below is the VB to bind the checkboxlist

myCmd.CommandText = "Select id, title from teams"
Dim DS As SqlDataReader
DS = myCmd.ExecuteReader
chklistTeams.DataValueField = "id"
chklistTeams.DataTextField = "title"
chklistTeams.DataSource = DS
chklistTeams.DataBind()
DS.Close()

When a save button is hit a javascript function is called. Here is the part of the function that is called that should get us the value of the items.

var checkList = document.getElementById('chklistTeams');
var checkBoxList = checkList.getElementsByTagName("input");
var checkBoxSelectedItems = new Array();

for (var i = 0; i < checkBoxList.length; i++) {
    if (checkBoxList[i].checked) {
        checkBoxSelectedItems.push(checkBoxList[i].value);
        alert('checked - checkBoxList[i]: ' + checkBoxList[i].value)
    }
}

All the values getting stored to the array (tested with the alert) - are coming back with the value "on" - so I then checked the html of the checkboxes in this list, here was the result for one of the checkboxes

<input name="chklistTeams:21" id="chklistTeams_21" type="checkbox" value="on"/>

I am sure the values are being binded correctly to the list - because in the old way of getting their values, you get the correct integer value for the item - listed below is that VB code that used to handle this (and returned a string of integers, depending on how many boxes were checked - did not return a list of the value "on"). I need to be able to get this via javascript for another modification we are making on this page where we must now save using PageMethods and can't use this on the back end with a public shared function

VB code that will get the right values of checked items in checkboxlist

    For Each li In chklistTeams.Items
        If li.Selected = True Then
            strTeamList = strTeamList & li.Value & ","
            bolTeamSelected = True
        End If
    Next
    If bolTeamSelected = True Then
        strTeamList = strTeamList.Substring(0, strTeamList.Length - 1)
    End If

Can anyone see why the javascript way to get the values is giving me "on" instead of the integer value like the VB way does? Thanks again for your help. Again - this must be done in JS - can't use the VB code behind way due to the function being public and shared. Thanks.

Upvotes: 0

Views: 8250

Answers (2)

HMR
HMR

Reputation: 39320

http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.checkboxlist.aspx

http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.listcontrol.items.aspx

http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.listitem.aspx

checkboxlist.items(index) is of type listitem, listitem has an attributes property that can set client side attributes

Here is the code example: ListItem.Attributes.Add not working

In your case in the chklistTeams DataBound event:

foreach(ListItem li in chklistTeams.Items)
{
     li.Attributes.Add("JSvalue", li.Value);
}

In JavaScript:

checkBoxSelectedItems.push(checkBoxList[i].getAttribute("JSvalue"));

Upvotes: 1

njj56
njj56

Reputation: 621

Found a solution to this, made global shared array, on load populated the array with the id values, then through javascipt i was able to get the index of the checked items - can then go to the array at that same index to get id value for later use.

Upvotes: 0

Related Questions