364,033 Members | 4721 Browsing Online
Community for Developers & IT Professionals
Bytes IT Community

Dynamic GridView Template for Header that fires Sorting Event

Frinavale
Expert Mod 5K+
P: 7,034
I have implemented the ITemplate interface to dynamically "display" complicated data in a GridView.

For the life of me I cannot implement the template in such a way that when it is applied to Header Data it is displayed as a link that raises a Sorting Event upon postback.

In my InstantiateIn method I create a LinkButton for my Header. I have added a handler to the LinkButton that calls a method upon DataBinding. In that method I have attempted everything I could possibly think of to get the LinkButton to cause a Sorting Event upon postback.

Has anyone done this?

I have a work around (that doesn't use a template for the Header) so there's is no urgency to this. I'm just dying to know how to get this to work.

Thanks

-Frinny
Jan 27 '09 #1

✓ answered by Frinavale

I went back to researching how to wire up dynamically created links/buttons in a template to click (command) events because I was never able to get this to work in the past.

The first thing to note is that you Must create your columns in your Page Init Event.

If you do not do this, the events for the controls created dynamically in your template will be lost. They will post back to the server, but then the event cease to exist.

Another thing to note is that events are handled by the controls that they occur in. This means that you have to implement code that handles the event in your ITemplate class. If you want this to be handled in the Page that the template belongs to you will have to Bubble Up the event.

One last thing to note is that Click Events do not automatically bubble up for LinkButtons, Buttons and ImageButtons. Only the Command Event will bubble up.

The following is an example of some code that creates a template and bubbles up the Command Event of the link buttons in the template to the Page that the template belongs to:

Expand|Select|Wrap|Line Numbers
  1. Public Partial Class Practice
  2.     Inherits System.Web.UI.Page
  3.     Private _theSource As List(Of SomeClass)
  4.  
  5.     Private Sub Practice_Init(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Init
  6.         _theSource = New List(Of SomeClass)
  7.         _theSource.Add(New SomeClass("first", "data 1"))
  8.         _theSource.Add(New SomeClass("second", "data 2"))
  9.         _theSource.Add(New SomeClass("third", "data 3"))
  10.         _theSource.Add(New SomeClass("fourth", "data 4"))
  11.         Session("_theSource") = _theSource
  12.  
  13. 'Please note that we are creating the GridView's Columns in the Page Init event.
  14. 'This is important because if you do not create the columns at this stage in the
  15. 'page life cycle the event for the dynamic link buttons will be lost!
  16.  
  17.         Dim tf As New TemplateField
  18.         tf.HeaderText = "My Stuff"
  19.  
  20. 'My Template is a Private Class that implements the ITemplate Field
  21. 'See it's definition farther down in the code.
  22.         Dim item As New MyTemplate()
  23.  
  24. 'Assigning the function named "MyCommandHandlingFunction" to handle the templates LinkButtonCommand Event 
  25.         AddHandler item.LinkButtonCommand, New CommandEventHandler(AddressOf MyCommandHandlingFunction)
  26.  
  27. 'I was using the following in an attempt to bubble up the Click event for the 
  28. 'Dynamic Link Button but this will never happen because I discovered that 
  29. 'Only the Command Event will bubble up.
  30. '        AddHandler item.LinkButtonClick, New EventHandler(AddressOf MyCommandHandlingFunction)
  31.  
  32.  
  33. 'Adding the item to the template field
  34.         tf.ItemTemplate = item
  35.  
  36. 'Creating the GridView's columns 
  37.         myGrid.Columns.Add(tf)
  38.  
  39.     End Sub
  40.  
  41. 'This method simply binds the data source to the data grid
  42.     Private Sub DisplayGridView()
  43.         If _theSource Is Nothing Then
  44.             _theSource = Session("_theSource")
  45.         End If
  46.         myGrid.DataSource = _theSource
  47.         myGrid.DataBind()
  48.     End Sub
  49.  
  50.     Private Sub Practice_PreRender(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.PreRender
  51.         DisplayGridView()
  52.     End Sub
  53.  
  54. 'This method handles the Command Event that originates from the LinkButton
  55. 'In the Template
  56.     Private Sub MyCommandHandlingFunction(ByVal sender As Object, ByVal e As CommandEventArgs)
  57.         'e.CommandArgument contains "Sort"...we set this in the Template
  58.     End Sub
  59.  
  60. '    Private Sub MyClickHandlingFunction(ByVal sender As Object, ByVal e As EventArgs)
  61. '
  62. '    End Sub
  63.  
  64.  
  65.     Private Class MyTemplate
  66.         Implements ITemplate
  67.         'Expose the command event handler - when the command event handler is trapped internally this event is raised to inform the container
  68.         Public Event LinkButtonCommand As CommandEventHandler
  69.         'Public Event LinkButtonClick As EventHandler
  70.  
  71.         Public Sub InstantiateIn(ByVal container As System.Web.UI.Control) Implements System.Web.UI.ITemplate.InstantiateIn
  72.             Dim text As New Label
  73.             text.Style.Add("display", "block")
  74.             text.Style.Add("width", "80px")
  75.             text.Style.Add("float", "left")
  76.  
  77.             AddHandler text.DataBinding, AddressOf Me.BindText
  78.             container.Controls.Add(text)
  79.  
  80.             Dim lnkBtn As New LinkButton
  81.             lnkBtn.Style.Add("float", "left")
  82.             AddHandler lnkBtn.DataBinding, AddressOf Me.BindLinkButtons
  83.             'AddHandler lnkBtn.Click, New EventHandler(AddressOf Click)
  84.             AddHandler lnkBtn.Command, New CommandEventHandler(AddressOf Command)
  85.             container.Controls.Add(lnkBtn)
  86.         End Sub
  87.  
  88.         Private Sub BindLinkButtons(ByVal sender As Object, ByVal e As EventArgs)
  89.             Dim lnkBtn As LinkButton = CType(sender, LinkButton)
  90.             Dim container As GridViewRow = CType(lnkBtn.NamingContainer, GridViewRow)
  91.             Dim cellContent As String = DataBinder.Eval(container.DataItem, "Content").ToString
  92.             lnkBtn.Text = cellContent
  93.             lnkBtn.CommandArgument = "Sort"
  94.  
  95.         End Sub
  96.         Private Sub BindText(ByVal sender As Object, ByVal e As EventArgs)
  97.             Dim txt As Label = CType(sender, Label)
  98.             Dim row As GridViewRow = CType(txt.NamingContainer, GridViewRow)
  99.             Dim cellContent As String = DataBinder.Eval(row.DataItem, "Title").ToString
  100.             txt.Text = cellContent + ": "
  101.         End Sub
  102.  
  103. ''This will crash because the only event that's bubbled up is the Command Event....which takes a parameter of CommandEventArgs
  104.         'Private Sub Click(ByVal sender As Object, ByVal e As EventArgs)
  105.         '    RaiseEvent LinkButtonClick(Me, e)
  106.         'End Sub
  107.  
  108. 'Handles the Command Event: 
  109. 'When the link button is clicked the Command event is bubbled up to the container, which happens to be this class.
  110. 'This method bubbles the event up to the next level so that the event can be
  111. 'handled in the Page.
  112.         Private Sub Command(ByVal sender As Object, ByVal e As CommandEventArgs)
  113.             RaiseEvent LinkButtonCommand(Me, e)
  114.         End Sub
  115.     End Class
  116.  
  117.  
  118.  
  119. 'This class is used for the DataSource of the GridView
  120.     Private Class SomeClass
  121.         Private _title As String
  122.         Private _content As String
  123.         Public Property Title() As String
  124.             Get
  125.                 Return _title
  126.             End Get
  127.             Set(ByVal value As String)
  128.                 _title = value
  129.             End Set
  130.         End Property
  131.         Public Property Content() As String
  132.             Get
  133.                 Return _content
  134.             End Get
  135.             Set(ByVal value As String)
  136.                 _content = value
  137.             End Set
  138.         End Property
  139.  
  140.         Public Sub New(ByVal theTitle As String, ByVal theContent As String)
  141.             _title = theTitle
  142.             _content = theContent
  143.         End Sub
  144.     End Class
  145.  
  146.  
  147. End Class

The ASPX code for this page is:
Expand|Select|Wrap|Line Numbers
  1. <%@ Page Language="vb" AutoEventWireup="false" CodeBehind="Practice.aspx.vb" Inherits="ScratchPad.Practice" %>
  2.  
  3. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  4.  
  5. <html xmlns="http://www.w3.org/1999/xhtml" >
  6. <head runat="server">
  7.     <title></title>
  8. </head>
  9. <body>
  10.     <form id="form1" runat="server">
  11.     <div>
  12.         <asp:GridView ID="myGrid" runat="server"
  13.                                   BorderColor="black"
  14.                                   GridLines="Horizontal"
  15.                                   BorderStyle="None"
  16.                                   allowpaging="True"
  17.                                   autogeneratecolumns="False"
  18.                                   style="margin-left:auto; margin-right:auto;"
  19.                                   width="200" EnableViewState="true"></asp:GridView>
  20.     </div>
  21.     </form>
  22. </body>
  23. </html>
Share this Question
Share on Google+
3 Replies


Frinavale
Expert Mod 5K+
P: 7,034
I went back to researching how to wire up dynamically created links/buttons in a template to click (command) events because I was never able to get this to work in the past.

The first thing to note is that you Must create your columns in your Page Init Event.

If you do not do this, the events for the controls created dynamically in your template will be lost. They will post back to the server, but then the event cease to exist.

Another thing to note is that events are handled by the controls that they occur in. This means that you have to implement code that handles the event in your ITemplate class. If you want this to be handled in the Page that the template belongs to you will have to Bubble Up the event.

One last thing to note is that Click Events do not automatically bubble up for LinkButtons, Buttons and ImageButtons. Only the Command Event will bubble up.

The following is an example of some code that creates a template and bubbles up the Command Event of the link buttons in the template to the Page that the template belongs to:

Expand|Select|Wrap|Line Numbers
  1. Public Partial Class Practice
  2.     Inherits System.Web.UI.Page
  3.     Private _theSource As List(Of SomeClass)
  4.  
  5.     Private Sub Practice_Init(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Init
  6.         _theSource = New List(Of SomeClass)
  7.         _theSource.Add(New SomeClass("first", "data 1"))
  8.         _theSource.Add(New SomeClass("second", "data 2"))
  9.         _theSource.Add(New SomeClass("third", "data 3"))
  10.         _theSource.Add(New SomeClass("fourth", "data 4"))
  11.         Session("_theSource") = _theSource
  12.  
  13. 'Please note that we are creating the GridView's Columns in the Page Init event.
  14. 'This is important because if you do not create the columns at this stage in the
  15. 'page life cycle the event for the dynamic link buttons will be lost!
  16.  
  17.         Dim tf As New TemplateField
  18.         tf.HeaderText = "My Stuff"
  19.  
  20. 'My Template is a Private Class that implements the ITemplate Field
  21. 'See it's definition farther down in the code.
  22.         Dim item As New MyTemplate()
  23.  
  24. 'Assigning the function named "MyCommandHandlingFunction" to handle the templates LinkButtonCommand Event 
  25.         AddHandler item.LinkButtonCommand, New CommandEventHandler(AddressOf MyCommandHandlingFunction)
  26.  
  27. 'I was using the following in an attempt to bubble up the Click event for the 
  28. 'Dynamic Link Button but this will never happen because I discovered that 
  29. 'Only the Command Event will bubble up.
  30. '        AddHandler item.LinkButtonClick, New EventHandler(AddressOf MyCommandHandlingFunction)
  31.  
  32.  
  33. 'Adding the item to the template field
  34.         tf.ItemTemplate = item
  35.  
  36. 'Creating the GridView's columns 
  37.         myGrid.Columns.Add(tf)
  38.  
  39.     End Sub
  40.  
  41. 'This method simply binds the data source to the data grid
  42.     Private Sub DisplayGridView()
  43.         If _theSource Is Nothing Then
  44.             _theSource = Session("_theSource")
  45.         End If
  46.         myGrid.DataSource = _theSource
  47.         myGrid.DataBind()
  48.     End Sub
  49.  
  50.     Private Sub Practice_PreRender(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.PreRender
  51.         DisplayGridView()
  52.     End Sub
  53.  
  54. 'This method handles the Command Event that originates from the LinkButton
  55. 'In the Template
  56.     Private Sub MyCommandHandlingFunction(ByVal sender As Object, ByVal e As CommandEventArgs)
  57.         'e.CommandArgument contains "Sort"...we set this in the Template
  58.     End Sub
  59.  
  60. '    Private Sub MyClickHandlingFunction(ByVal sender As Object, ByVal e As EventArgs)
  61. '
  62. '    End Sub
  63.  
  64.  
  65.     Private Class MyTemplate
  66.         Implements ITemplate
  67.         'Expose the command event handler - when the command event handler is trapped internally this event is raised to inform the container
  68.         Public Event LinkButtonCommand As CommandEventHandler
  69.         'Public Event LinkButtonClick As EventHandler
  70.  
  71.         Public Sub InstantiateIn(ByVal container As System.Web.UI.Control) Implements System.Web.UI.ITemplate.InstantiateIn
  72.             Dim text As New Label
  73.             text.Style.Add("display", "block")
  74.             text.Style.Add("width", "80px")
  75.             text.Style.Add("float", "left")
  76.  
  77.             AddHandler text.DataBinding, AddressOf Me.BindText
  78.             container.Controls.Add(text)
  79.  
  80.             Dim lnkBtn As New LinkButton
  81.             lnkBtn.Style.Add("float", "left")
  82.             AddHandler lnkBtn.DataBinding, AddressOf Me.BindLinkButtons
  83.             'AddHandler lnkBtn.Click, New EventHandler(AddressOf Click)
  84.             AddHandler lnkBtn.Command, New CommandEventHandler(AddressOf Command)
  85.             container.Controls.Add(lnkBtn)
  86.         End Sub
  87.  
  88.         Private Sub BindLinkButtons(ByVal sender As Object, ByVal e As EventArgs)
  89.             Dim lnkBtn As LinkButton = CType(sender, LinkButton)
  90.             Dim container As GridViewRow = CType(lnkBtn.NamingContainer, GridViewRow)
  91.             Dim cellContent As String = DataBinder.Eval(container.DataItem, "Content").ToString
  92.             lnkBtn.Text = cellContent
  93.             lnkBtn.CommandArgument = "Sort"
  94.  
  95.         End Sub
  96.         Private Sub BindText(ByVal sender As Object, ByVal e As EventArgs)
  97.             Dim txt As Label = CType(sender, Label)
  98.             Dim row As GridViewRow = CType(txt.NamingContainer, GridViewRow)
  99.             Dim cellContent As String = DataBinder.Eval(row.DataItem, "Title").ToString
  100.             txt.Text = cellContent + ": "
  101.         End Sub
  102.  
  103. ''This will crash because the only event that's bubbled up is the Command Event....which takes a parameter of CommandEventArgs
  104.         'Private Sub Click(ByVal sender As Object, ByVal e As EventArgs)
  105.         '    RaiseEvent LinkButtonClick(Me, e)
  106.         'End Sub
  107.  
  108. 'Handles the Command Event: 
  109. 'When the link button is clicked the Command event is bubbled up to the container, which happens to be this class.
  110. 'This method bubbles the event up to the next level so that the event can be
  111. 'handled in the Page.
  112.         Private Sub Command(ByVal sender As Object, ByVal e As CommandEventArgs)
  113.             RaiseEvent LinkButtonCommand(Me, e)
  114.         End Sub
  115.     End Class
  116.  
  117.  
  118.  
  119. 'This class is used for the DataSource of the GridView
  120.     Private Class SomeClass
  121.         Private _title As String
  122.         Private _content As String
  123.         Public Property Title() As String
  124.             Get
  125.                 Return _title
  126.             End Get
  127.             Set(ByVal value As String)
  128.                 _title = value
  129.             End Set
  130.         End Property
  131.         Public Property Content() As String
  132.             Get
  133.                 Return _content
  134.             End Get
  135.             Set(ByVal value As String)
  136.                 _content = value
  137.             End Set
  138.         End Property
  139.  
  140.         Public Sub New(ByVal theTitle As String, ByVal theContent As String)
  141.             _title = theTitle
  142.             _content = theContent
  143.         End Sub
  144.     End Class
  145.  
  146.  
  147. End Class

The ASPX code for this page is:
Expand|Select|Wrap|Line Numbers
  1. <%@ Page Language="vb" AutoEventWireup="false" CodeBehind="Practice.aspx.vb" Inherits="ScratchPad.Practice" %>
  2.  
  3. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  4.  
  5. <html xmlns="http://www.w3.org/1999/xhtml" >
  6. <head runat="server">
  7.     <title></title>
  8. </head>
  9. <body>
  10.     <form id="form1" runat="server">
  11.     <div>
  12.         <asp:GridView ID="myGrid" runat="server"
  13.                                   BorderColor="black"
  14.                                   GridLines="Horizontal"
  15.                                   BorderStyle="None"
  16.                                   allowpaging="True"
  17.                                   autogeneratecolumns="False"
  18.                                   style="margin-left:auto; margin-right:auto;"
  19.                                   width="200" EnableViewState="true"></asp:GridView>
  20.     </div>
  21.     </form>
  22. </body>
  23. </html>
Jan 28 '09 #2

Jack Hack
P: 6
Frinny,

I've been grappling with this problem for several days before locating your informative post. Not only did you provide a working example but your explanation of the problem allowed me to understand why my original attempts to handle such events were not working. Priceless.

I made one small deviation, I found that I had to add the gridview_RowCommand event handler to process the commandName and commandArgument (and subsequent logic) passed by my link button.

My solution is within a visual web part but I'm not sure if this would account for the change.

Thanks again,

Jack
Feb 17 '11 #3

Frinavale
Expert Mod 5K+
P: 7,034
I'm not sure why you had to make that change but I'm glad that my post helped you. I know I spent a lot of time trying to figure this stuff out :)
Feb 17 '11 #4

Post your reply

Help answer this question



Didn't find the answer to your ASP.NET question?

You can also browse similar questions: ASP.NET