单击div以切换内部复选框

时间:2017-11-30 22:49:24

标签: html asp.net checkbox datalist itemtemplate

我有一个带有ItemTemplate的DataList,它创建了以下ui:

ui

片段:

    <asp:DataList ID="DataList1" runat="server" RepeatColumns="5" RepeatDirection="Horizontal" DataKeyField="Key">

            <ItemTemplate>
                <div id="Row">
                    <div id="Cell">
                        <div id="Permission_Label_Div">
                            <asp:Label runat="server" ID="Permission_Label" Text='<%# Eval("Key") %>'></asp:Label>
                        </div>

                        <div id="Permission_CheckBox_Div">
                            <asp:CheckBox runat="server" AutoPostBack="true" ID="Permission_CheckBox" Checked='<%# Eval("Value") %>' />
                        </div>
                    </div>
                </div>
            </ItemTemplate>

        </asp:DataList>

我遇到的麻烦是允许用户通过单击其各自的div来切换复选框。我假设因为DataList是一个asp服务器控件,我将不得不等待页面完成加载在我可以访问每个DataList项之前。任何帮助将不胜感激。

1 个答案:

答案 0 :(得分:2)

这样的事情应该起作用

$("div#cell").click(function(){
        var checkbox = $(this).find("input[type=checkbox]");
        checkbox.prop('checked', !checkbox.is(':checked'));
    })