Hacer que toda la fila se pueda hacer clic en una vista de cuadrícula

Question

Tengo una vista de cuadrícula y necesito activar un evento cuando se hace clic en una fila.

¿Hay algún evento GridView al que tenga que enlazar para que esto suceda?

Answer 1

No hay ningún evento existente para manejar un clic de fila completo. Su mejor opción es tener algún javascript (tal vez a través de ASP.NET Ajax) detectar el clic y disparar el evento usted mismo. Alternativamente, debería crear un botón o casilla de verificación que el usuario seleccione.

Answer 2

Debe controlar el evento "SelectedIndexChanged", puede consultar la cuadrícula para .SelectedRow. Alternativley utiliza el evento "SelectedIndexChanging" que establece "e.NewSelectedIndex"

Answer 3

Consulte this article por Teemu, donde explica cómo hacer clic en una fila en Gridview y lanzar el evento RowClicked.

Aquí es un extracto del código:

Protected Overrides Sub RaisePostBackEvent(ByVal eventArgument As String) 
      If eventArgument.StartsWith("rc") Then 
       Dim index As Integer = Int32.Parse(eventArgument.Substring(2)) 
       Dim args As New GridViewRowClickedEventArgs(Me.Rows(index)) 
       OnRowClicked(args) 
      Else 
       MyBase.RaisePostBackEvent(eventArgument) 
      End If 

     End Sub 

Public Class GridViewRowClickedEventArgs 
     Inherits EventArgs 

     Private _row As GridViewRow 
     Public Sub New(ByVal row As GridViewRow) 
      _row = row 
     End Sub 
     Public ReadOnly Property Row() As GridViewRow 
      Get 
       Return _row 
      End Get 
     End Property 
    End Class 

Por cierto, es en VB no C# sin embargo.

Answer 4

Será necesaria alguna programación de Javascript para que esto suceda.

Básicamente tendrá que manejar el evento de clic para la fila (en algunos navegadores, la fila no tiene un evento de clic, por lo que podría tener que manejar el evento de clic de los tds ... tiempo de invertir en un ajax framework!)

A continuación, desde javascript tendrá que iniciar una devolución de datos con el índice de la fila como parámetro. Ver encosia (un gran sitio para ASP.Net - implementaciones ajax) sobre cómo hacer eso. Aquí es una link a un artículo en ese sentido

Answer 5

Aquí hay algo que preparé antes:

public class RowClickableGridView : GridView 
    { 
     public Style HoverRowStyle 
     { 
      get { return ViewState["HoverRowStyle"] as Style; } 
      set { ViewState["HoverRowStyle"] = value; } 
     } 

     public bool EnableRowClickSelection 
     { 
      get { return ViewState["EnableRowClickSelection"] as bool? ?? true; } 
      set { ViewState["EnableRowClickSelection"] = value; } 
     } 

     public string RowClickCommand 
     { 
      get { return ViewState["RowClickCommand"] as string ?? "Select"; } 
      set { ViewState["RowClickCommand"] = value; } 
     } 

     public string RowToolTip 
     { 
      get 
      { 
       if (!RowToolTipSet) return string.Format("Click to {0} row", RowClickCommand.ToLowerInvariant()); 
       return ViewState["RowToolTip"] as string; 
      } 
      set 
      { 
       ViewState["RowToolTip"] = value; 
       RowToolTipSet = true; 
      } 
     } 

     private bool RowToolTipSet 
     { 
      get { return ViewState["RowToolTipSet"] as bool? ?? false; } 
      set { ViewState["RowToolTipSet"] = value; } 
     } 

     protected override void OnPreRender(EventArgs e) 
     { 
      base.OnPreRender(e); 
      foreach (GridViewRow row in Rows) 
      { 
       if (row.RowType != DataControlRowType.DataRow) continue; 

       if (EnableRowClickSelection && row.RowIndex != SelectedIndex && row.RowIndex != EditIndex) 
       { 
        if (string.IsNullOrEmpty(row.ToolTip)) row.ToolTip = RowToolTip; 
        row.Style[HtmlTextWriterStyle.Cursor] = "pointer"; 

        PostBackOptions postBackOptions = new PostBackOptions(this, 
                      string.Format("{0}${1}", 
                         RowClickCommand, 
                         row.RowIndex)); 
        postBackOptions.PerformValidation = true; 
        row.Attributes["onclick"] = Page.ClientScript.GetPostBackEventReference(postBackOptions); 


        foreach (TableCell cell in row.Cells) 
        { 
         foreach (Control control in cell.Controls) 
         { 
          const string clientClick = "event.cancelBubble = true;{0}"; 
          WebControl webControl = control as WebControl; 
          if (webControl == null) continue; 
          webControl.Style[HtmlTextWriterStyle.Cursor] = "Auto"; 
          Button button = webControl as Button; 
          if (button != null) 
          { 
           button.OnClientClick = string.Format(clientClick, button.OnClientClick); 
           continue; 
          } 
          ImageButton imageButton = webControl as ImageButton; 
          if (imageButton != null) 
          { 
           imageButton.OnClientClick = string.Format(clientClick, imageButton.OnClientClick); 
           continue; 
          } 
          LinkButton linkButton = webControl as LinkButton; 
          if (linkButton != null) 
          { 
           linkButton.OnClientClick = string.Format(clientClick, linkButton.OnClientClick); 
           continue; 
          } 
          webControl.Attributes["onclick"] = string.Format(clientClick, string.Empty); 
         } 
        } 
       } 

       if (HoverRowStyle == null) continue; 
       if (row.RowIndex != SelectedIndex && row.RowIndex != EditIndex) 
       { 
        row.Attributes["onmouseover"] = string.Format("this.className='{0}';", HoverRowStyle.CssClass); 
        row.Attributes["onmouseout"] = string.Format("this.className='{0}';", 
                   row.RowIndex%2 == 0 
                    ? RowStyle.CssClass 
                    : AlternatingRowStyle.CssClass); 
       } 
       else 
       { 
        row.Attributes.Remove("onmouseover"); 
        row.Attributes.Remove("onmouseout"); 
       } 
      } 
     } 

     protected override void Render(HtmlTextWriter writer) 
     { 
      base.Render(writer); 
      foreach (GridViewRow row in Rows) 
      { 
       if (row.RowType == DataControlRowType.DataRow) 
       { 
        Page.ClientScript.RegisterForEventValidation(row.ClientID); 
       } 
      } 
     } 
    } 
 

A continuación, se enganchan en los eventos de comandos estándar fila ...

Answer 6

Esto se puede hacer fácilmente mediante la adición un dummy LinkButton sin texto en el GridView y algún código en el RowDataBound. El LinkButton es necesario en la página para evitar el error Invalid postback or callback argument. Establecer la visibilidad en false también causará este error.

El LinkButton también tiene un CommandArgument con el número de fila actual y un evento OnCommand para manejar el clic real.

<asp:TemplateField> 
    <ItemTemplate> 
     <asp:LinkButton ID="LinkButton1" runat="server" CommandArgument='<%# Container.DataItemIndex %>' OnCommand="LinkButton1_Command"></asp:LinkButton> 
    </ItemTemplate> 
</asp:TemplateField> 

El método OnRowDataBound

protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e) 
{ 
    //check if the row is a datarow 
    if (e.Row.RowType == DataControlRowType.DataRow) 
    { 
     //find the linkbutton with findcontrol and cast it back to one 
     LinkButton lb = e.Row.FindControl("LinkButton1") as LinkButton; 

     //create the correct postback event with the UniqueID property of the linkbutton 
     string href = "javascript:__doPostBack('" + lb.UniqueID + "','')"; 

     //add the onclick event with the correct href to the row 
     e.Row.Attributes.Add("onclick", href); 

     //to make it visible to the user that the row can be clicked 
     e.Row.Attributes.Add("style", "cursor:pointer;"); 
    } 
} 

y el método de comando donde se puede obtener la CommandArgument del LinkButton y hacer todo tipo de cosas interesantes con ella.

protected void LinkButton1_Command(object sender, CommandEventArgs e) 
{ 
    //the row index of the clicked row from the grid if needed 
    int rowIndex = Convert.ToInt32(e.CommandArgument); 

    //do stuff 
}