选中复选框后，使用 jquery 获取数据网格值

本文关键字：数据 获取 数据网 网格 jquery 使用 复选框 | 更新日期: 2023-09-27 18:36:38

我在 c# 的网格视图中有一个复选框模板字段，这个字段还有一个隐藏字段，后面有 id。我想使用 jQuery 在单击复选框时引发事件以获取数据键值，以便我可以通过 jQuery 运行查询并将选中的项目添加到数据库中。我见过在单击整个按钮时获取数据键的示例，但我希望在网格视图中单击的每个复选框上都发生这种情况。我目前在尝试访问 id 时遇到"未定义"。

网格视图中的 C#

<ItemTemplate>
     <asp:CheckBox ID="CheckBox" CssClass="checkbox" runat="server" />
     <asp:HiddenField ID="idnum" runat="server" Value='<%# Eval("id") %>' />
</ItemTemplate>

jQuery

$(document).ready(function () {
           var gridResults = document.getElementById('<%= grdResults.ClientID %>');
           $("form input:checkbox").click(function (e) {
                   var id = $(this).next('#idnum').val();
                   alert(id);
                   return false;                                        
           });
});

选中复选框后，使用 jquery 获取数据网格值

如果有多个字段包含ID="idnum"，您可能应该将其更改为 class="idnum" 。添加类后，您可以使用以下命令获取值：

var gridResults = $(e.target).next('.idnum').val();

如果idnum只是一个示例，每个字段都不同，则可以只使用var id = $('#idnum').val();

编辑：将e.target.next('.idnum').val();更改为$(e.target).next('.idnum').val();以将元素转换为jQuery对象

//这是在 GridView 内的复选框检查事件上获取数据密钥名称值的脚本

<script type="text/jscript">
        $(document).ready(function () {
            var gridResults = document.getElementById('<%= grdCateogry.ClientID %>');
            $("form input:checkbox").click(function (e) {
                var id = $(this).next($('#IDVal')).val();
                alert(id);
                return false;
            });
        });
    </script>

这是网格视图

<asp:GridView ID="grdCateogry" DataKeyNames="CategoryId" runat="server">
    <Columns>
      <asp:TemplateField HeaderText ="Try" ItemStyle-Width="20px">
         <ItemTemplate>
           <asp:CheckBox ID="chkSelect" runat="server" />   
           <asp:HiddenField ID="IDVal" runat="server" Value='<%# Eval("CategoryId") %>' />
          </ItemTemplate>
        </asp:TemplateField>
    </Columns>
</asp:GridView>

相关文章：