visual studio 2008 - find nested checkboxlist in repeater control with jquery

Question

Using VS 2008, I have a Repeater control with nested elements and want to select one of them (the checkboxes) with jquery.

<asp:Repeater runat="server" ID="storesRep" DataSourceID="storeSqlDataSource" OnItemDataBound="StoresRep_ItemDataBound">
        <ItemTemplate>
            <table style="padding:0px">
            <tr>
                <td style="width:200px"><asp:Label ID="infoLbl" runat="server">Choose stores for upload:</asp:Label>&nbsp;&nbsp;&nbsp;&nbsp;</td>
                <td style="width:110px"><asp:Label ID="storeLbl" runat="server" Text='<%# Bind("Name") %>'></asp:Label>&nbsp;&nbsp;</td>
                <td><asp:CheckBox runat="server" ID="storeCheck" CssClass="storeCheck" /></td>
            </tr>
            </table>
        </ItemTemplate>
        <FooterTemplate>
            <table runat="server" id="footerTbl" visible="false" style="padding:0px">
                <tr>
                    <td style="width:200px"><asp:Label ID="infoLbl" runat="server">Choose stores for upload:</asp:Label>&nbsp;&nbsp;&nbsp;&nbsp;</td>
                    <td><asp:Label ID="lblEmptyData" Text="No Stores found." runat="server" ForeColor="GrayText"></asp:Label></td>
                </tr>
            </table>        
         </FooterTemplate>
    </asp:Repeater>

Here is my script

$('#<%= uploadBtn.ClientID %>').click(
    function() {

        //check if store was chosen from list
        var storeChecked = false;
        $('#<%= storeCheck.ClientID %>').each(function() {

            if ($(this).attr('checked'))
                storeChecked = true;
        });
        if (storeChecked == false) {
            alert("Upload is only possible if a store has been chosen from list.");
            return false;
        }

I get the compiler error "storeCheck is not a known name in the current context".

Answer 1

It's not working because you are trying to access storeCheck using it's ID and storeCheck only exists in the context of the repeater.

What you should do is use the class instead. So change:

$('#<%= storeCheck.ClientID %>').each(function() {

to

$('.storeCheckBox').each(function() {

You can also change you code to this which just checks if there are any checked checkboxes with the class of storeCheck:

$('#<%= uploadBtn.ClientID %>').click(function() {
    if($('span.storeCheck input:checked').length == 0) {
        alert("Upload is only possible if a store has been chosen from list.");
        return false;
    }
});

Changed the code as it appears that asp.net puts the checkbox inside a span with the class you supply rather than applying it straight to the checkbox.

jsfiddle - http://jsfiddle.net/infernalbadger/rAVLA/1/