Handling Events within a Repeater Control Using ASP.NET 2.0
page 3 of 4
by Shaun Eutsey
Feedback
Average Rating: This article has not yet been rated.
Views (Total / Last 10 Days): 33657/ 37

The Solution

The following is an extremely simplified version of what I did to solve the problem; however, the techniques used are the same.


So, let us dive in and start by creating the project.  I am using an ASP.Net AJAX-Enabled Web Site, I will call it EventHandlingInRepeaterControl.

Figure 1

Style sheets are very important for this example, so here is the code that I am using for the style sheet.

Listing 1: Stylesheet.css

.FlagHeader
{
      width:50px;
      text-align:center;
}
 
.NameHeader
{
      width:100px;
}
 
.RedButton
{
      width:50px;
      background-color: Red;
}
 
.YellowButton
{
      width:50px;
      background-color:Yellow;
}
 
.GreenButton
{
      width:50px;
      background-color:Green;
}

I added a repeater control, tucked safely within an Update Panel, to Default.aspx. 

Listing 2: Default.aspx

<asp:UpdatePanel ID="upExample" runat="server">
<ContentTemplate>
     <asp:Repeater ID="drExample" runat="server"     
             OnItemCommand=" drExample_ItemCommand ">
          <HeaderTemplate>
               <div>
                   <asp:Label ID="lblName" runat="server" Text="Name" 
                          Width="100px" CssClass="NameHeader" /> 
                   <asp:Label ID="lFlag1" runat="server" Text="Flag 1" 
                          Width="50px"  CssClass="FlagHeader" />
                   <asp:Label ID="lFlag2" runat="server" Text="Flag 2" 
                          Width="50px"  CssClass="FlagHeader" />
                   <asp:Label ID="lFlag3" runat="server" Text="Flag 3" 
                          Width="50px"  CssClass="FlagHeader" />
               </div>
           </HeaderTemplate>                    
           <ItemTemplate>
               <div>
                   <asp:Label ID="lName" runat="server" Width="100px"  
                         CssClass="NameDetail" 
                         Text='<%# Eval("ItemName") %>' />
                   <asp:Button ID="bFlag1" runat="server" Width="50px"  
                         CssClass="RedButton" />
                   <asp:Button ID="bFlag2" runat="server" Width="50px"  
                         CssClass="RedButton" />
                   <asp:Button ID="bFlag3" runat="server" Width="50px"  
                         CssClass="RedButton" />
               </div>        
            </ItemTemplate>
       </asp:Repeater>
</ContentTemplate>
</asp:UpdatePanel>

Notice that this is an extremely basic and simple setup.  I highlighted the two most important parts of the repeater.

1.      ItemName is the name of the column of the dataset that I will be passing to the repeater.

2.      drExample_ItemCommand is the function that will be used to parse which button is being clicked.

Okay, now that the basics of the form are setup, we need to load the repeater when the page loads.  For this example I did not want to do any data interaction with an actual database, so I created an array, and placed the data from the array into a dataset for binding.  Here are the two functions used for doing this:

Listing 3: Default.aspx.vb

Protected Sub Page_Load(ByVal sender As ObjectByValAs System.EventArgs)
   Handles Me.Load
        If IsPostBack = False Then
            drExample.DataSource = getData()
            drExample.DataBind()
        End If
    End Sub
    Private Function getData() As DataSet
        Dim arExample() As String = {"Test 1""Test 2""Test 3""Test 4"}
        Dim ds As New DataSet
        Dim dt As New DataTable("ExampleTable")
        ds.Tables.Add(dt)
        Dim dc As New DataColumn("ItemName")
        dt.Columns.Add(dc)
 
        Dim cnt As Int32 = 0
        For cnt = 0 To arExample.GetUpperBound(0) - 1
            Dim dr As DataRow = dt.NewRow
            dr("ItemName"= arExample(cnt).ToString
            dt.Rows.Add(dr)
        Next
        Return ds
    End Function

However, this would be good enough to make the page display the repeater, but not enough to really make the repeater functional like I needed.  After all, without knowing the exact name of the button that was being pushed, and even at that, not knowing what row that button belonged to, well, there had to be a way of doing this, and there is.  I used ItemDataBound to change some of the properties on the buttons at run-time.  Here is the function:

Listing 4: Default.aspx.vb

Protected Sub drExample_ItemDataBound(ByVal sender As ObjectByVal e As 
          System.Web.UI.WebControls.RepeaterItemEventArgs) Handles 
          drExample.ItemDataBound
    If e.Item.ItemType = ListItemType.Item Or e.Item.ItemType = 
        ListItemType.AlternatingItem Then
        Dim bFlag1 As Button = CType(e.Item.FindControl("bFlag1"), Button)
        Dim bFlag2 As Button = CType(e.Item.FindControl("bFlag2"), Button)
        Dim bFlag3 As Button = CType(e.Item.FindControl("bFlag3"), Button)
        Dim sArgument As String = CType(e.Item.DataItem, 
                 DataRowView).Row.Item("ItemName").ToString
            If Not IsNothing(bFlag1) Then
                setFlagCommands(bFlag1, "Flag1_Change", sArgument)
            End If
 
            If Not IsNothing(bFlag2) Then
                setFlagCommands(bFlag2, "Flag2_Change", sArgument)
            End If
 
            If Not IsNothing(bFlag3) Then
                setFlagCommands(bFlag3, "Flag3_Change", sArgument)
            End If    
     End If
End Sub
 
Private Sub setFlagCommands(ByVal bFlag As Button, ByVal sCommand As String,
          ByVal sArgument As String)
    bFlag.CommandName = sCommand
    bFlag.CommandArgument = sArgument
End Sub
 

To explain this code:

I first check to make sure that I am looking in the Item or the Alternating Item regions of the repeater control. The buttons that I want to manipulate are there, so why waste cycles...

Then I take the three buttons on each row of the repeater and cast them into an actual button variable. This is for simplicity in the rest of the function.

Then I create the Command Argument that will be set on the button.  I am not using it here in the example, but in the real world I set this to the Record Identifier, so I could update the correct record in the database.

I then check to make sure the buttons are instantiated and call the subroutine that sets the command name and the command argument.

We do all of that so that when the drExample_ItemCommand is fired, I can make sure the right code is being called.

Now, when this page is run it looks like this:

Figure 2

Now, I will click on Test 1/Flag 1.

Figure 3

As you can see, the button is now green.


Now, click on Test 2/ Flag 2 once.

Figure 4

Then click a second time.

Figure 5

Then click on Test 3/Flag 3.

Figure 6

Again click a second time.

Figure 7

I changed the behavior on each flag so that there was a reason to use the command name. I did not have to go through the drExample_ItemDataBound step here; this is a simple example, but for anything harder where the buttons need to do vastly different things and they need to save information to a database, that step is crucial, so I added it here to help in a real world situation.


View Entire Article

User Comments

Title: hi   
Name: hi
Date: 2012-08-29 6:57:34 AM
Comment:
hi
Title: V Good   
Name: Osama
Date: 2009-08-16 9:33:01 AM
Comment:
Very Good Explanation, Great Article
Title: un necessary explanation   
Name: Robin Thomas
Date: 2009-06-28 1:33:20 AM
Comment:
So much of unnecessary explanation. People don't have time to read your story. Stick to the core..
Title: LinkButton ,Label inside Repeater - ASP.NET   
Name: Tanvir
Date: 2009-06-12 11:55:24 PM
Comment:
There is also a good post about repeater event in the following blog post :
(LinkButton ,Label inside Repeater - ASP.NET)
http://tanvirdotnet.blogspot.com/2009/06/linkbutton-label-inside-repeater-aspnet.html
Title: programmer   
Name: jitendra
Date: 2008-12-15 11:46:01 PM
Comment:
it helped lot to me
Title: Net.Dev   
Name: Chow
Date: 2008-09-29 5:48:34 PM
Comment:
great job..i appreaciate it..






Community Advice: ASP | SQL | XML | Regular Expressions | Windows


©Copyright 1998-2024 ASPAlliance.com  |  Page Processed at 2024-03-28 11:57:14 AM  AspAlliance Recent Articles RSS Feed
About ASPAlliance | Newsgroups | Advertise | Authors | Email Lists | Feedback | Link To Us | Privacy | Search