ASP.NET Gridview 使用 'onRowClick' 显示记录的详细信息（而不是 Details/Select 按钮）

Question

好的，我有一个 gridView

<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False"
     RowStyle-CssClass="td" HeaderStyle-CssClass="th"
    CellPadding="6" DataKeyNames="ID" ShowFooter="true">

     <Columns>
        <asp:BoundField DataField="Name" HeaderText="Name" />
        <asp:BoundField DataField="Date" HeaderText="Date" />
        ......
         <asp:TemplateField>
           <ItemTemplate>
             <asp:Button ID="lnkDetails" runat="server" Text="Details" OnClick="DetailsView" CommandName="DetailsCommand"></asp:Button>
           </ItemTemplate>
        </asp:TemplateField>
     </Columns>

如您所见，我已经配置了 "lnkDetails" 按钮，以便在单击时触发 DetailsView() 函数，该函数然后调用 "SqlCommand" 并将数据绑定到 "asp Repeater"，本质上显示所选记录的自定义 "Details View"。

 Protected Sub DetailsView(ByVal sender As Object, ByVal e As EventArgs)

        Dim con As New SqlConnection
        Dim cmd As New SqlCommand

        con.ConnectionString = ConnectionString() 'Thats a function
        con.Open()
        cmd.Connection = con
        cmd.CommandText = "SELECT FROM... WHERE ID=" & id & ""

        ....

        Repeater1.DataSource = cmd.ExecuteReader()
        Repeater1.DataBind()
 End Sub

相当简单吧？

现在我想要做的（UI-wise）是允许用户通过选择记录的（整个）行而不是详细信息按钮来触发该点击事件。然后我想隐藏它。

我很确定您可以使用 jquery 从 .aspx 页面（onRowClick 转到并单击详细信息按钮）或从后面的代码执行此操作，我只是没有找到适用于我呢。有什么想法吗？

Answer 1

检查这个例子：

<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataSourceID="SqlDataSource1">
            <Columns>
                <asp:ButtonField CommandName="click" Text="Click" Visible="False" />
                <asp:BoundField DataField="IDcontato" HeaderText="ID" />
                <asp:BoundField DataField="nome" HeaderText="Name" />
            </Columns>
            <SelectedRowStyle BackColor="#FFFF66" Font-Bold="True" />
        </asp:GridView>

创建按钮字段并将其可见性设置为 false。在后面的代码中，你可以这样做：

  Protected Overrides Sub Render(writer As HtmlTextWriter)
        For Each row As GridViewRow In GridView1.Rows
            'You have register the events so it wont fire any event validation errors on rutime
            If row.RowType = DataControlRowType.DataRow Then
                Page.ClientScript.RegisterForEventValidation(row.UniqueID & "$ctl00")
            End If
        Next

        MyBase.Render(writer)
    End Sub

    Protected Sub GridView1_RowCommand(sender As Object, e As GridViewCommandEventArgs) Handles GridView1.RowCommand
        'Capture the event and do what you want
        Dim _commandName As String = e.CommandName

            Select (_commandName)
            'filter by command name, so you can have multiple events for each row
            Case ("click")
                'do something
                Dim _gridView As GridView = CType(sender, GridView)
                Dim _Index As Integer = e.CommandArgument.ToString()
                _gridView.SelectedIndex = _Index


        End Select

    End Sub

    Protected Sub GridView1_RowCreated(sender As Object, e As GridViewRowEventArgs) Handles GridView1.RowCreated
        If e.Row.RowType = DataControlRowType.DataRow And e.Row.RowState <> DataControlRowState.Selected Then
            'Set the apropriate css for the rows
            e.Row.Attributes.Add("onmouseover", "this.style.cursor='hand';")
            e.Row.Attributes.Add("onmouseout", "this.style.cursor='pointer';")
        End If
    End Sub


    Protected Sub GridView1_RowDataBound(sender As Object, e As GridViewRowEventArgs) Handles GridView1.RowDataBound

        'Capture the button event and set it for the entire row
        If e.Row.RowType = DataControlRowType.DataRow Then
            Dim _ClickButton As LinkButton = CType(e.Row.Cells(0).Controls(0), LinkButton)
            e.Row.Attributes("onclick") = ClientScript.GetPostBackClientHyperlink(_ClickButton, "")

        End If

    End Sub

希望对您有所帮助。

Answer 2

好吧，我设法解决了这个简单但繁琐的任务。最后，我确实在 Andrei 提到的另一个 post 中重新设计了解决方案。这是我想出的：

Protected Sub GridView1_RowDataBound(ByVal sender As Object, ByVal e As GridViewRowEventArgs) Handles GridView.RowDataBound
    If e.Row.RowType = DataControlRowType.DataRow Then
        e.Row.Attributes.Add("onclick", Page.ClientScript.GetPostBackEventReference(GridView1, "Select$" + e.Row.RowIndex.ToString()))
    End If
End Sub

Protected Sub GridView1_SelectedIndexChanged(sender As Object, e As EventArgs) Handles GridView1.SelectedIndexChanged
    Try
        FillDetailsView(GridView1.SelectedIndex)
    Catch
        '...
    End Try
End Sub


Protected Sub FillDetailsView(RecordIndex)

    Dim id = GridView1.DataKeys(RecordIndex).Value

    'By passing the Row Index here and using the GridView's DataKey which is pointing to the record's ID field
    'I am ready to go to work

End Sub

Felipe 你的也是一个有趣的例子，尽管不太适用于我当前的代码（..和我的 post 支持）

感谢大家的指点！

ASP.NET Gridview 使用 'onRowClick' 显示记录的详细信息（而不是 Details/Select 按钮）

ASP.NET Gridview use 'onRowClick' to display record's Details (instead of Details/Select Button)

vb.net

asp.net

jquery

gridview

webforms