Topic: How to use a collection with a repeater and Hover Menu
Description: This topic discusses how to bind a collection to a repeater. It will also show you how to get the object back by using a AJAX Hover Menu
Notes: (None)
1. Within your .vb or .cs file, define a collection object and fill it. E.g...
Private Property thisMyObjectCollection() As MyProject.Model.MyObjectCollection
Get
If ViewState("thisMyObjectCollection") Is Nothing Then
Return Nothing
Else
Return CType(ViewState("thisMyObjectCollection"), MyProject.Model.MyObjectCollection)
End If
End Get
Set(ByVal Value As MyProject.Model.MyObjectCollection)
ViewState("thisMyObjectCollection") = Value
End Set
End Property
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs)
Dim myObjectBLL As New MyProject.MyObject
If Not IsPostBack Then
' This calls an App Logic Layer method that will return a MyObjectCollection
thisMyObjectCollection = myObjectBLL.GetColectionOfMyObjects()
' This Loads the values into the repeater
rptMyObjectCollection.DataSource = thisMyObjectCollection
rptMyObjectCollection.DataBind()
End If
End Sub
2. Within your .aspx page, place a reapeater on the page
<table>
<asp:Repeater ID="rptMyObjectCollection" runat="server">
<ItemTemplate>
<tr runat="server" id="trMyObjectCollectionList">
<td align="left">
<asp:Label Id="lblMainLabel" runat="server" Text='<%#CType(Container.DataItem, MyProject.Model.MyObjectCollection).MyObjectsNameField %>' />
</td>
<td>
<asp:CheckBox Id="chkSomeCheckBox" runat="server" Checked='<% IIF(CType(Container.DataItem, MyProject.Model.MyObjectCollection).MyObjectsBitField = 1, "True", "False") %>' />
<asp:TextBox Id="txtSomeTextBoxControl" runat="server" Text='<% CType(Container.DataItem, MyProject.Model.MyObjectCollection).MyObjectsStringField %>' />
</td>
<td>
<asp:Panel CssClass="popupMenu" ID="PopupMenu" runat="server">
<div style="border: 1px outset white; padding:2px; width:85px">
<asp:LinkButton ID="lnkEditMyObject" runat="server" CommandName="Edit" Text="Edit" />
<asp:LinkButton ID="lnkDeleteMyObject" runat="server" CommandName="Delete" Text="Delete" />
</div>
</asp:Panel >
</td>
</tr>
<AjaxToolkit:HoverMenuExtender ID="hmeMyObject" runat="server"
HoverCssClass="popupHover"
PopupControlID="PopupMenu"
PopupPosition="Right"
TargetControlID="trMyObjectCollectionList"
PopDelay="25" />
</ItemTemplate>
</asp:Repeater >
</table>
3. You will need to add the repeater's ItemCommand Event to get the object back
Protected Sub rptMyObjectCollection_ItemCommand(ByVal source As Object, ByVal e As System.Web.UI.WebControls.RepeaterCommandEventArgs) Handles rptMyObjectCollection.ItemCommand
Dim MyObject As MyClass.Model.MyObject 'Single item, not a collection
If e.CommandName = "Edit" Then
' Get the object
MyObject = thisMyObjectCollection.Item(e.Item.ItemIndex)
Else
thisMyObjectCollection.RemoveAt(e.Item.itemIndex)
End If
End Sub
4. If you have to dynamically work with hiding columns inside a table that are within a repeater, you can use the example below:
If MyCondition = True Then
If Not rptMyObjectCollection.Items Is Nothing AndAlso rptMyObjectCollection.Items.Count > 0 Then
For Each i As RepeaterItem In rptMyObjectCollection.Items
For Each ctrl As Control In i.FindControl("trMyRepeatersRow").Controls
ctrl.FindControl("tdMyRepeatersColumn1").Visible = False
Next
Next
End If
Else
5. To do validation on some of the controls within a repeater, you can use the example below:
Dim InvalidValue As Boolean = False
For Each i As RepeaterItem In rptMyObjectCollection.Items
For Each ctrl As Control In i.FindControl("trMyRepeaterRow").Controls
Dim lbl As New Label
Dim txt As New TextBox
lbl = ctrl.FindControl("lblMainLabel")
If lbl.Text.Trim = SomeStringValue.Trim Then
txt = ctrl.FindControl("txtSomeTextControl")
If Not IsNumeric(txt.Text.Trim) Then
InvalidValue = True
End If
End If
Next
Next
6. Sometimes when working with a repeater, you will need to get the values individually instead of. In that situation, you can use the following example:
For Each MyOb As MyClass.Model.MyObject In thisMyObjectCollection
For Each i As RepeaterItem In rptMyObjectCollection.Items
For Each ctrl As Control In i.FindControl("trMyRepeaterRow").Controls
Dim lbl As New Label
Dim txt As New TextBox
Dim chk As New CheckBox
lbl = ctrl.FindControl("lblMainLabel")
If lbl.Text.Trim = SomeStringValue.Trim Then
txt = ctrl.FindControl("txtSomeTextControl")
MyOb.StringProperty = txt.Text
chk = ctrl.FindControl("chkSomeCheckBox")
MyOb.BitProperty = IIF(chk.checked, 1, 0)
End If
Next
Next
Next
7. Below are the CSS tags used:
.popupMenu
{
position:absolute;
visibility:hidden;
background-color:black;
opacity:.9;
filter: alpha(opacity=90);
font-size:13px;
margin-top:-14px;
text-align:left;
font-weight:bold;
color:Silver;
}
.popupMenu a
{
color:Silver;
}
.popupHover
{
background-color:Transparent;
}