【问题标题】：Get The Label Value of a Gridview by Clicking a Button uing Jquery通过使用 Jquery 单击按钮获取 Gridview 的标签值
【发布时间】：2015-06-27 02:25:26
【问题描述】：

我有这个带有标签描述和按钮编辑的 ASP Gridview，我的问题是我无法使用 JQuery 在按钮单击时获取标签的 ID。我怎样才能做到这一点？

这是我的 HTML 代码

<asp:GridView runat="server" ID="grdAssetInventory" AutoGenerateColumns="False">
<Columns>
<asp:TemplateField HeaderText="Decription">
<ItemTemplate>
<asp:Label ID="lblDesc" runat="server" Text='<% #Eval("Description")%>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<ItemTemplate>
<asp:Button runat="server" ID="grdEdit" Text="Edit" OnClientClick="return GetSelectedRow(this)" />
</ItemTemplate>
</ItemTemplateField>                    
</Columns>
</asp:GridView>

我的 JQuery 代码

function GetSelectedRow(lnk) {
        var row = lnk.parentNode.parentNode;
        var rowIndex = row.rowIndex - 1;                                                          
        alert("RowIndex: " + rowIndex);
        return false;
    }

【问题讨论】：

标签： javascript c# jquery asp.net gridview

【解决方案1】：

查看标签的 ClientIDMode 属性 - https://msdn.microsoft.com/en-us/library/system.web.ui.clientidmode.aspx

您可能希望将其更改为可预测。

【讨论】：

【解决方案2】：

我看到您正在使用 javascript。如果您实际使用 JQuery。这对我有用：

<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" 
    DataKeyNames="ID" DataSourceID="SqlDataSource1">
    <Columns>
        <asp:BoundField DataField="ID" HeaderText="ID" ReadOnly="True" SortExpression="ID">
            <ItemStyle CssClass="idField"></ItemStyle>
        </asp:BoundField>
        <asp:BoundField DataField="Name" HeaderText="Name" SortExpression="Name" />
        <asp:ButtonField Text="Button" ControlStyle-CssClass="buttonField"/>
    </Columns>
</asp:GridView>
<asp:SqlDataSource ID="SqlDataSource1" runat="server" 
    ConnectionString="<%$ ConnectionStrings:DefaultConnection %>" 
    SelectCommand="SELECT * FROM [Customer]"></asp:SqlDataSource>
<script type="text/javascript">
    $(document).ready(function () {
        $.each($(".buttonField"), function(index, btn) {
            $(btn).on('click', function (e) {
                alert("Row clicked " + $("table tr").index($(this).closest("tr"))
                    + ", Id " + $(this).parent("td").siblings("td.idField").text().trim());
                e.preventDefault();
            });
        });
    });
</script>

请注意，为了便于遍历，我给出了 idField 和 buttonField 的名称。

【讨论】：

【解决方案3】：

我知道我参加聚会迟到了，但我自己努力寻找解决方案，我希望这可以帮助任何像我一样陷入困境的人。这是在另一个问题中找到的解决方案：How to Get TextBox value from button click in Nested Gridview .在ConnorsFan提供的答案中，很清楚他使用jquery中的以下代码找到某个控件的方法

1.)在asp.net html部分的gridview的item模板中：

 <asp:TemplateField>
<ItemTemplate>
    <asp:TextBox ID="TextBox1" runat="server" />
    <asp:Button ID="Button1" runat="server" Text="Button" OnClientClick="showText(this); return false;" />
</ItemTemplate>

2.) jquery 代码

 function showText(btn) {
alert($(btn).closest('div').find('input[type=text]').val());
}

备注：

gridview 在 html 中表示为行表和表数据单元格，因此我没有搜索 div，而是搜索了表行或“tr” 我创建了一个隐藏字段并在 gridview_rowdatabound() 中为其分配了一个值，以便能够区分不同的类型，代码最终为：

  var i = $(btn).closest('tr').find('input[type=hidden]').val();
  alert('subscribed to ' + i );

【讨论】：