通过JQuery从CheckBoxList中查找特定的Checkbox

时间:2015-01-23 15:10:26

标签: jquery asp.net checkboxlist

我在查找特定的复选框时遇到了一些麻烦。 在一个包含大约100个复选框的动态asp.net CheckboxList中,我有一个右键单击上下文菜单,想要获取我打开上下文菜单的特定复选框。

<%= checkboxlist.ClientID%>

只获取整个复选框列表


这是我的javascript / JQuery:

<script type="text/javascript">

    function ShowMenu(control, e) {
        var posx = e.clientX + window.pageXOffset + 'px';
        var posy = e.clientY + window.pageYOffset - 10 + 'px';
        document.getElementById(control).style.position = 'absolute';
        document.getElementById(control).style.display = 'inline';
        document.getElementById(control).style.left = posx;
        document.getElementById(control).style.top = posy;
        var parent = document.getElementById('<%= cbl_Machines.ClientID%>');
    };

    function HideMenu(control) {
        document.getElementById(control).style.display = 'none';
    };

    $(document).on('click', '#divSelectAll', function () {
        $("INPUT[type='checkbox']").prop('checked', true);
        __doPostBack();
    });

    $(document).on('click', '#divDeselectAll', function () {
        $("INPUT[type='checkbox']").prop('checked', false);
        __doPostBack();
    });

    $(document).on('click', '#divAddMachine', function () {
        window.location.replace("../MemberPages/CreateMachine.aspx");
    });

    $(document).on('click', '#divModifyMachine', function () {
        alert('<%=cbl_Machines.ClientID%>');
    });
</script>

这是我的HTML:

<body>
<div id="leftBox" onmousedown="HideMenu('contextMenu');"oncontextmenu="ShowMenu('contextMenu',event);">
    <asp:CheckBoxList ID="cbl_Machines" Width="100%" RepeatLayout="Table" CssClass="cblmachines" runat="server" AutoPostBack="True" OnSelectedIndexChanged="cbl_Machines_SelectedIndexChanged" />
    <div style="padding: 0px 5px; border: 1px solid black; border-top-style: none">
        <asp:Button ID="btn_CreateMachine" Width="33%" runat="server" Text="Add Machine" OnClick="btn_CreateMachine_Click" />
        <asp:Button ID="btn_ModifyMachine" Width="32%" runat="server" Text="Modify Machine" OnClick="btn_ModifyMachine_Click" />
        <asp:Button ID="btn_DeleteMachine" Width="32%" runat="server" Text="Delete Machine" OnClick="btn_DeleteMachine_Click" />
    </div>
</div>

<div style="display: none;" id="contextMenu" onmouseup="HideMenu('contextMenu');">
    <table border="0" style="border: thin solid #808080; cursor: default; width: 150px; background-color: white">
        <tr>
            <td>
                <div id="divSelectAll" class="ContextItem">Select All</div>
            </td>
        </tr>
        <tr>
            <td>
                <div id="divDeselectAll" class="ContextItem">Deselect All</div>
            </td>
        </tr>
        <tr>
            <td>
                <div id="divAddMachine" class="ContextItem">Add Machine</div>
            </td>
        </tr>
        <tr>
            <td>
                <div id="divModifyMachine" class="ContextItem">Modify Machine</div>
            </td>
        </tr>
    </table>
</div>
</body>

最后但并非最不重要的是我的代码背后

        if (!Page.IsPostBack)
        {
            Configuration.DeserializeFromXMLMachines();

            var orderedList = Configuration.ManagedMachines.OrderBy(x => x.MachineName);
            foreach (var item in orderedList)
            {
                cbl_Machines.Items.Add(item.MachineName+ "<a class='HLdetails' href=\"MachineDetails.aspx?Name=" + item.MachineName + "\">></a>");
            }
        }

当我右键点击左框中的#39;显示以下上下文菜单

http://i.imgur.com/h4fqHye.jpg

现在当我点击Modify Machine时,我只需要上下文菜单打开的复选框的值。在这种情况下,值为Test24的那个。

1 个答案:

答案 0 :(得分:0)

也许使用checkboxlist.SelectedItem及其&#39;属性可以让你到达某个地方。您必须为每个复选框设置一个Value或一个唯一的HTML id,以允许jQuery实际找到它。

您也可以从已经拥有ClientID的CheckBoxList的input子项(复选框)中搜索您已经去过的地方。假设只选择了一个复选框,此代码将返回其“&#39;关联的jQuery对象(我现在不能使用的未经测试的开发工具):

var selected = $("#<%=checkboxlist.ClientID %> input:checked");