在GridView中选择行使用JavaScript [英] Select row in GridView with JavaScript

问题描述

我几个问题，GridView控件在asp.net中，

i've a few problem with GridView in asp.net ,

<asp:GridView 
    ID="gridAdministrator" 
    runat="server" 
    AllowSorting="true" 
    AutoGenerateColumns="false" 
    AllowPaging="true" 
    OnRowDeleting="gridAdministrator_RowDeleting" >
    <Columns>
        <asp:BoundField DataField="Id" HeaderText="ID" ReadOnly="true" />
        <asp:BoundField DataField="Name" HeaderText="Name" />
        <asp:BoundField DataField="Phone" HeaderText="Phone" />
        <asp:BoundField DataField="Address" HeaderText="Address" />
        <asp:BoundField DataField="City" HeaderText="City" />
        <asp:BoundField DataField="Mail" HeaderText="Mail" />
        <asp:BoundField DataField="Password" HeaderText="Password" />
        <asp:TemplateField>
            <ItemTemplate>
                <a href="#" onclick="ShowPopUpAdmin();">Edit</a>
            </ItemTemplate>
        </asp:TemplateField>
        <asp:CommandField ShowDeleteButton="true" />
    </Columns>
</asp:GridView>

当我点击编辑链接，它会显示在编辑AJAX弹出面板，但我怎么能现在，这行是被点击？任何解决办法？请帮我。

when i click Edit link, its will show up the edit AJAX popup panel, but how can i now, which row that being clicked? Any solution? Please help me.

推荐答案

你的问题不是很清楚，什么时候你说你想要的行的话，这里有3种不同的方法来做到以下你的意思是：

Your question isn't very clear as to what you mean when you say you want the "row" so, here are 3 different ways to do the following:

1. 获取该行的ID
2. 获取该行的指数
3. 突出显示该行对鼠标悬停

通过上述3种方式，你应该能够pretty的多弄清楚什么你正在尝试做的。

With the above 3 ways, you should be able to pretty much figure out anything you are trying to do.

下面是code：

Javascript的

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
    $(document).ready(function() {       
            $(".tbl tr:has(td)").css({ background: "ffffff" }).hover(
                function() { $(this).css({ background: "#C1DAD7" }); },
                function() { $(this).css({ background: "#ffffff" }); }
                );
        });
</script>

HTML / ASPX

<asp:GridView 
    ID="gridAdministrator" 
    CssClass="tbl"
    runat="server" 
    AllowSorting="true" 
    AutoGenerateColumns="false" 
    AllowPaging="true" 
    OnRowDeleting="gridAdministrator_RowDeleting" >
    <Columns>
        <asp:BoundField DataField="Id" HeaderText="ID" ReadOnly="true" />
        <asp:BoundField DataField="Name" HeaderText="Name" />
        <asp:BoundField DataField="Phone" HeaderText="Phone" />
        <asp:BoundField DataField="Address" HeaderText="Address" />
        <asp:BoundField DataField="City" HeaderText="City" />
        <asp:BoundField DataField="Mail" HeaderText="Mail" />
        <asp:BoundField DataField="Password" HeaderText="Password" />
        <asp:TemplateField>
            <ItemTemplate>
                <a href="#" onclick="ShowPopUpAdmin();">Edit</a>
                <a href="#" onclick="alert('<%# Eval("ID") %>');">Click to show ID</a><br />
                <a href="#" onclick="alert('<%# Container.DataItemIndex %>');">Click to show Row Index</a>
            </ItemTemplate>
        </asp:TemplateField>
        <asp:CommandField ShowDeleteButton="true" />
    </Columns>
</asp:GridView>

这篇关于在GridView中选择行使用JavaScript的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！