解决GridView中动态按钮点击仅获取首行数据的问题

你猜的没错！问题确实出在ClientIDMode="Static"上——当你给GridView里的控件设置这个属性时，每行生成的文本框和按钮都会拥有完全相同的ID，浏览器DOM不允许重复ID存在，所以jQuery的$('#TxtButton')只会找到第一行的按钮，自然每次都拿到第一行的数据。

下面是具体的修复步骤：

1. 移除静态ID设置 #

先把ASPX中控件的ClientIDMode="Static"属性删掉，让ASP.NET自动生成唯一的客户端ID。修改后的模板字段代码如下：

<asp:TemplateField HeaderText="Alternate Names">
    <ItemTemplate>
        <asp:TextBox runat="server" ID="altTxtNames" Style="display: none" onblur="buttonupdate(this)"></asp:TextBox>
        <asp:Button runat="server" ID="TxtButton" Style="visibility: hidden; display: none" OnClick="TxtButton_Click" />
    </ItemTemplate>
</asp:TemplateField>

此时ASP.NET会生成类似GridView1_altTxtNames_0、GridView1_TxtButton_0这样的唯一ID，每行的控件ID都不一样。

2. 修改jQuery函数，定位当前行的按钮 #

不需要再用固定ID查找按钮，而是通过触发事件的文本框，找到它所在行的对应按钮。修改buttonupdate函数：

function buttonupdate(alternateTxtNames) {
    // 找到当前文本框的兄弟按钮（因为它们在同一个ItemTemplate里）
    $(alternateTxtNames).siblings('[id$="TxtButton"]').click();
}

或者更稳妥的方式，先找到当前行，再在该行内查找按钮：

function buttonupdate(alternateTxtNames) {
    // 先定位到GridView的行，再找该行内的按钮
    $(alternateTxtNames).closest('tr').find('[id$="TxtButton"]').click();
}

这里的[id$="TxtButton"]是属性选择器，会匹配所有ID以TxtButton结尾的元素，刚好对应ASP.NET生成的客户端ID。

3. 后台代码无需修改 #

你的TxtButton_Click方法逻辑是对的——通过sender获取触发点击的按钮，再通过NamingContainer拿到当前GridView行，这样就能正确获取该行的NameId和文本框内容了。

做完这些修改后，再测试任意一行的文本框onblur事件，就能触发对应行的按钮点击，后台也能拿到正确的行数据了。

内容的提问来源于stack exchange，提问作者Sreedhar Danturthi