Welcome to AspAdvice Sign in | Join | Help

@ASP.NET Forums: How to develop a row-clickable DataGrid control?

As subject tells, this one was asked at Forums. Of course, such is easy to write using built-in features of DataGrid when you place Button controls on templates and catch ItemCommand event, however if you want to catch the click from entire row area, you ened to do some work. It's a good candidate for being a custom control, for example,  which catches clicks targeted at DataGrid rows (rows of the rendered HTML table).

Here is a very simple example I wrote about in 3 minutes. Therefore it is very raw and you could make it better in many ways, however, it also effectively demonstrates how easy this is to achieve and how powerful DataGrid actually is.

Imports System.Web
Imports System.Web.UI
Imports System.Web.UI.WebControls

Public Class Clickablegrid
    Inherits DataGrid
    Implements IPostBackEventHandler

    'Event which is raised when a row is clicked
    Public Event ItemClicked(ByVal sender As Object, ByVal e As EventArgs)

    'Method to raise the event
    Protected Overridable Sub OnItemClicked(ByVal sender As Object, ByVal e As EventArgs)
        RaiseEvent ItemClicked(sender, e)
    End Sub

    'When items are created, add the script to cause a postback
    'with item index as argument
    Protected Overrides Sub CreateControlHierarchy(ByVal useDataSource As Boolean)
        MyBase.CreateControlHierarchy(useDataSource)

        Dim i As Integer
        For i = 0 To Items.Count - 1
            Me.Items(i).Attributes.Add("onclick", Page.GetPostBackEventReference(Me, i.ToString()))
        Next
    End Sub

    'When a row is clicked, this is called and event will be raised
    'with the specific item as sender of the event
    Public Sub RaisePostBackEvent(ByVal eventArgument As String) Implements System.Web.UI.IPostBackEventHandler.RaisePostBackEvent
        If Not eventArgument Is Nothing Then
            Dim i As Integer = Int32.Parse(eventArgument)
            OnItemClicked(Me.Items(i), EventArgs.Empty)
        End If
    End Sub
End Class
And usage example
<cc1:Clickablegrid id="Clickablegrid1" runat="server" />
 
Private Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
        If Not Page.IsPostBack Then
            Dim a As New ArrayList
            a.Add(1)
            a.Add(2)
            a.Add(3)

            Clickablegrid1.DataSource = a
            Clickablegrid1.DataBind()
        End If
    End Sub


    Private Sub Clickablegrid1_ItemClicked(ByVal sender As Object, ByVal e As System.EventArgs) Handles Clickablegrid1.ItemClicked
        Response.Write("Index of the clicked item was: " & CType(sender, DataGridItem).ItemIndex)
    End Sub
 
 
Sponsor
Published Sunday, January 30, 2005 5:49 PM by joteke
Filed under:

Comment Notification

If you would like to receive an email when updates are made to this post, please register here

Subscribe to this post's comments using RSS

Comments

# re: @ASP.NET Forums: How to develop a row-clickable DataGrid control?

is it possible to do this within a page for 1 datagrid? i don't want to have to create a user control...

thanks...
Wednesday, March 30, 2005 6:44 PM by joteke

# re: @ASP.NET Forums: How to develop a row-clickable DataGrid control?

With quick glance, why not (but note that there's no need for user control in the original solution it's a pure server control like DataGrid itself is). You could add the attribute in say DataGrid's ItemDataBound event. Catching which item was clicked can be tirckier but it can be done via Request.Form collection manually or by associating the page itself with postback data handling (implement IPostBackdatahandker on page itself, a hack but can work out)
Wednesday, March 30, 2005 7:14 PM by joteke

# re: @ASP.NET Forums: How to develop a row-clickable DataGrid control?

To update the grid to work for paging, you can index the items based on paging settings

Etc
CurrentPageIndex * PageSize + Item.ItemIndex
Thursday, July 28, 2005 8:07 PM by joteke

# Developing a row-clickable GridView

Joteke&#160;a post&#233; un&#160;exemple tr&#232;s simple et bien expliqu&#233; pour d&#233;velopper ajouter &#224; une gridView un &#233;v&#233;nement...
Monday, January 09, 2006 8:22 AM by Tonio's developper .NET Blog

# Developing a row-clickable GridView

Joteke&#160;a post&#233; un&#160;exemple tr&#232;s simple et bien expliqu&#233; pour d&#233;velopper ajouter &#224; une gridView un &#233;v&#233;nement...
Monday, January 09, 2006 8:29 AM by Tonio's developper .NET Blog

# Developing a row-clickable GridView

Joteke&#160;a post&#233; un&#160;exemple tr&#232;s simple et bien expliqu&#233; pour d&#233;velopper ajouter &#224; une gridView un &#233;v&#233;nement...
Monday, January 09, 2006 9:08 AM by Tonio's developper .NET Blog

# re: @ASP.NET Forums: How to develop a row-clickable DataGrid control?

I need to do this by c#.

I have coverted this but it asks the namespace for ItemClickEventHandler fro ItemCLicked event.

Can u post the C# coding for this one?

Thank u
Monday, February 13, 2006 6:34 AM by Praveena

# re: @ASP.NET Forums: How to develop a row-clickable DataGrid control?

At its simplest you can just have EventHandler as type of ItemClick event

public event EventHandler ItemClicked;

if that's what you mean (though it's recommended to use optimized event implementation)

Tuesday, February 14, 2006 9:18 AM by joteke

# How to put the call of event in the class object ?

I would prefer to put the function "Clickablegrid1_ItemClicked" inside the code of my herited datagrid

Then i would set the current row index and the developper will not add any function in the code of the page

How to do that ?

thx

Thursday, March 02, 2006 6:06 AM by Ost

# re: @ASP.NET Forums: How to develop a row-clickable DataGrid control?

Create a custom event for the grid, in the same manner I did with GridView, that's one way to simplify it.

http://aspadvice.com/blogs/joteke/archive/2006/01/07/14576.aspx

You can also just do it in RaisePostBackEvent method, since that's what calls OnItemClicked and again raises ItemClicked event.
Thursday, March 02, 2006 12:46 PM by joteke

# re: @ASP.NET Forums: How to develop a row-clickable DataGrid control?

Guys,

I tried this and it works like a charm [just 2 lines of code].  I've not tested this completely, however, I hope you get the idea.

Protected Sub CatalogGridView_RowCreated(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles CatalogGridView.RowCreated
       Dim PostBack As String = Page.ClientScript.GetPostBackEventReference(CatalogGridView, "Select$" & e.Row.RowIndex)
       e.Row.Attributes.Add("OnClick", PostBack)
   End Sub
Friday, August 18, 2006 12:08 AM by Rajesh

# Datagrid - select entire row | keyongtech

Wednesday, January 21, 2009 9:06 PM by Datagrid - select entire row | keyongtech

Leave a Comment

(required) 
required 
(required) 
Enter the code you see below