如何在 Javascript 或 JQuery 的 Gridview 中获取选定的行

How do I get the selected row in Gridview in Javascript or JQuery

提问by Paul T. Rykiel

Let me elaborate ... below is my partial gridview with a button field ... what I want is the text value of the button to use in building a url:

让我详细说明......下面是我的带有按钮字段的部分网格视图......我想要的是用于构建网址的按钮的文本值：

<asp:GridView CssClass="gridUser" ID="UsersGrid" ClientIDMode="Static" runat="server" AllowPaging="true" AllowSorting="true" PageSize="5" OnPageIndexChanging="PageIndexChange" OnRowCommand="Paging" OnSorting="SortPage" OnRowCreated="RowCreated"
                AutoGenerateColumns="false">

                <PagerSettings Mode="NextPreviousFirstLast" FirstPageImageUrl="~/Images/Navigation/firstpageIcon.png" LastPageImageUrl="~/Images/Navigation/lastpageIcon.png"
                    NextPageImageUrl="~/Images/Navigation/forwardOneIcon.png" PreviousPageImageUrl="~/Images/Navigation/backOneIcon.png" Position="Bottom" />

                <Columns>
                    <asp:TemplateField HeaderText="User Name" HeaderStyle-CssClass="gridHeader">
                        <ItemTemplate>
                           <asp:Button ID="UserLink" ClientIDMode="Static" runat="server" Text='<%#Eval("UserName") %>' CssClass="linkButton" OnClientClick = "return GetSelectedRow(this)"></asp:Button>
                    </ItemTemplate>
                        </asp:TemplateField>

and here is my javascript :

这是我的javascript：

 $(".linkButton").click(function () {
        var ul = document.getElementById('UserLink');
        var row = ul.parentNode.parentNode;
        var rowIndex = row.rowIndex - 1;
        var Userid = row.cells[0].childNodes[1].value;
        var User = Userid;
        alert("Row is : " + row + "RowIndex is : " + rowIndex + "User ID is " + User);
    });

My issue is that my row returned is the first row ... not the selected row ... how do I get the selected row? Thank you for any assistance.

我的问题是我返回的行是第一行......不是所选行......我如何获得所选行？感谢您提供任何帮助。

回答by Vikram

Try this... Change naming conventions according to your requirement

试试这个...根据您的要求更改命名约定

<script type = "text/javascript">
        function GetSelectedRow(UserLink) {
            var row = UserLink.parentNode.parentNode;
            var rowIndex = row.rowIndex - 1;
            var Userid = row.cells[0].innerHTML;
            alert("RowIndex: " + rowIndex + " Userid : " + Userid + ");
            return false;
        }
    </script>

回答by Jared

Your first problem is that in your button template column you are using an Id=UserLinkwhich will get repeated for each row. Your element id's should be unique. See this answerfor more details.

您的第一个问题是，在您的按钮模板列中，您使用的Id=UserLink将在每一行重复。您的元素 ID 应该是唯一的。有关更多详细信息，请参阅此答案。

Your second problem is that document.getElementById('UserLink');will actually find the first element with the id of UserLinkwhich is always going to be the first row. In your case you can us var ul = this;and that should give you the button that was actually clicked.

你的第二个问题是document.getElementById('UserLink');实际上会找到第一个元素，其 idUserLink总是将是第一行。在您的情况下，您可以使用我们var ul = this;，这应该会给您实际点击的按钮。

To summarize:

总结一下：

• I would suggest getting ride of the id on your button or make them unique.
• Change document.getElementById('UserLink')to thisand that will get you the button that was clicked.

• 我建议在您的按钮上使用 id 或使它们独一无二。
• 更改document.getElementById('UserLink')为this，这将使您获得单击的按钮。