How to nest repeaters in asp.net - c#

I need to know how to nest repeaters within a user control. The html side of things is fine, it's the binding and code behind I need help with. I've only been able to find examples using an sql data source, which doesn't really help.
My repeaters look like this:
<asp:Panel ID="pnlDiscipline" runat="server" CssClass="">
<asp:Repeater ID="rptDiscipline" runat="server">
<ItemTemplate>
<h4><%#Eval("Discipline")%></h4>
<ul>
<asp:Repeater ID="rptPrograms" runat="server">
<ItemTemplate>
<li><asp:HyperLink runat="server" Text='<%#Eval("Name") %>' NavigateUrl='<%#Eval("Link") %>'></asp:HyperLink> <%#Eval ("Notation") %></li>
</ItemTemplate>
</asp:Repeater>
</ul>
</ItemTemplate>
</asp:Repeater>
What I need to do is hopefully reasonably clear - the h4 discipline should appear once, all the entries that belong to the discipline are listed below, then the next h4, then the appropriate list, the next h4 and so on.
The datasource is a dataview created in the codebehind where each row has 'Name', "Link', 'NOtation' and 'Discipline'. I've bound the dataview to the outermost repeater, and it behaves as expected - lists the discipline name for each entry, but shows no data in the inner repeater.
How do I go about making this work?
EDIT: Just to clarify, I have one datatable in the codebehind. Each row in that table is an item, each item belongs to a discipline. I want to use the outer repeater to list the disciplines, the inner to list the items grouped under each discipline. Like so:
<h4>DISCIPLINE 1</h4>
<ul>
<li>Item</li>
<li>Item</li>
<li>Item</li>
</ul>
<h4>DISCIPLINE 2</h4>
<ul>
<li>Item</li>
<li>Item</li>
</ul>
<h4>DISCIPLINE 3</h4>
<ul>
<li>Item</li>
<li>Item</li>
</ul>
At present, binding the datatable to the outer repeater gives this (example uses the data above):
<h4>DISCIPLINE 1</h4>
<h4>DISCIPLINE 1</h4>
<h4>DISCIPLINE 1</h4>
<h4>DISCIPLINE 2</h4>
<h4>DISCIPLINE 2</h4>
<h4>DISCIPLINE 3</h4>
<h4>DISCIPLINE 3</h4>
I've used OnItemDataBound on the outer repeater as suggested, and as a test case am able to access the data:
protected void rptDiscipline_ItemDataBound(Object Sender, RepeaterItemEventArgs e)
{
DataRowView drView = (DataRowView) e.Item.DataItem;
string name = drView["Name"] as string;
string link = drView["Link"] as string;
string notation = drView["Notation"] as string;
Response.Write(name + link + notation + "<br />")
}
So the data is there, it is exactly what I would expect to see, I just can't get it bound to the inner repeater. If there is a more performant way to achieve the same, I'm happy to rework my solution.

On the outer control, use the ItemDataBound event, like this:
<asp:Repeater ID="rptDiscipline" runat="server"
OnItemDataBound="rptDiscipline_ItemDataBound">
...
Then, in the code-behind, handle the rptDiscipline_ItemDataBound event and manually bind the inner repeater. The repeater's ItemDataBound event fires once for each item that is repeated. So you'll do something like this:
protected void rptDiscipline_ItemDataBound(Object Sender, RepeaterItemEventArgs e)
{
// To get your data item, cast e.Item.DataItem to
// whatever you're using for the data object; for example a DataRow.
// Get the inner repeater:
Repeater rptPrograms = (Repeater) e.Item.FindControl("rptPrograms");
// Set the inner repeater's datasource to whatever it needs to be.
rptPrograms.DataSource = ...
rptPrograms.DataMember = ...
rptPrograms.DataBind();
}
EDIT: Updated to match your question's update.
You need to bind the outer repeater to a data source that has only one record per item you want the repeater to render. That means the data source needs to be a collection/list/datatable/etc that has only the disciplines in it. In your case, I would recommend getting a List<string> of disciplines from the DataTable for the inner collection, and bind the outer repeater to that. Then, the inner repeater binds to a subset of the data in the DataTable, using the ItemDataBound event. To get the subset, filter the DataTable through a DataView.
Here's code:
protected void Page_Load(object sender, EventItems e)
{
// get your data table
DataTable table = ...
if ( !IsPostBack )
{
// get a distinct list of disciplines
List<string> disciplines = new List<string>();
foreach ( DataRow row in table )
{
string discipline = (string) row["Discipline"];
if ( !disciplines.Contains( discipline ) )
disciplines.Add( discipline );
}
disciplines.Sort();
// Bind the outer repeater
rptDiscipline.DataSource = disciplines;
rptDiscipline.DataBind();
}
}
protected void rptDiscipline_ItemDataBound(Object Sender, RepeaterItemEventArgs e)
{
// To get your data item, cast e.Item.DataItem to
// whatever you're using for the data object
string discipline = (string) e.Item.DataItem;
// Get the inner repeater:
Repeater rptPrograms = (Repeater) e.Item.FindControl("rptPrograms");
// Create a filtered view of the data that shows only
// the disciplines needed for this row
// table is the datatable that was originally bound to the outer repeater
DataView dv = new DataView( table );
dv.RowFilter = String.Format("Discipline = '{0}'", discipline);
// Set the inner repeater's datasource to whatever it needs to be.
rptPrograms.DataSource = dv;
rptPrograms.DataBind();
}

If you don't want to do it on the ItemDataBound event, you can also do it inline in your page by binding to a child property of the parent item if the child property is a collection like so:
<asp:Repeater runat="server" ID="OuterRepeater" >
<ItemTemplate>
Outer Content: <%# DataBinder.Eval(Container.DataItem, "ParentProperty")%>
<asp:Repeater runat="server" ID="InnerRepeater" DataSource='<%# DataBinder.Eval(Container.DataItem, "ChildCollection")%>' >
<ItemTemplate>
<%# DataBinder.Eval(Container.DataItem, "ChildProperty")%>
</ItemTemplate>
</asp:Repeater>
</ItemTemplate>
</asp:Repeater>

First you need two lists, the list of disciplines, and then the list of all your data.
Data bind the list of disciplines to the outer repeater. If there are 6 disciplines, the repeater should repeat 6 times.
<asp:Repeater ID="rptDiscipline" runat="server" OnItemDataBound="rptDiscipline_ItemDataBound">
<ItemTemplate>
<h4><%# Eval("Discipline")%></h4>
<ul>
<asp:Repeater runat="server" ID="InnerRepeater" >
<ItemTemplate>
<li>
<asp:Label runat="server" ID="lbl" />
</li>
</ItemTemplate>
</asp:Repeater>
</ul>
</ItemTemplate>
</asp:Repeater>
protected void rptDiscipline_ItemDataBound(Object Sender, RepeaterItemEventArgs e)
{
Repeater inner= (Repeater) e.Item.FindControl("InnerRepeater");
//You want to bind all the data related to this discipline
DataRowView drView = (DataRowView) e.Item.DataItem;
string discipline= drView["Discipline"] as string;
//filter your total data with ones that match the discipline
inner.DataSource = //data bind the filtered list here
inner.DataBind();
}

Related

ASP.NET Index of parent repeater item (in nested repeaters)

I have a nested repeaters, i.e. a parent repeater and a child repeater. The child repeater contains only one DropDownList control. I have OnSelectedIndexChanged setup on DropDownList control. I can get the index of the child repeater item when the drop down list's selection is changed.
My question is: How can I get the index of the parent repeater in which the drop down list's selection was changed.
Here is the sample code:
<asp:Repeater runat="server" ID="ParentRepeater">
<ItemTemplate>
<asp:Repeater runat="server" ID="ChildRepeater">
<ItemTemplate>
<asp:DropDownList runat="server" ID="DropDownInChildRepeater" OnSelectedIndexChanged="DropDownInChildRepeater_OnSelectedIndexChanged" />
</ItemTemplate>
</asp:Repeater>
</ItemTemplate>
</asp:Repeater>
protected void DropDownInChildRepeater_OnSelectedIndexChanged(object sender, EventArgs e)
{
var dropDownInChildRepeater = (DropDownList)sender;
var dropDownInChildRepeaterItem = (RepeaterItem)dropDownInChildRepeater.NamingContainer;
var indexOfDropDownInChildRepaterItem = dropDownInChildRepeater.ItemIndex;
//Question I need index of ParentRepeater in which sender resides
}
You were on the right track with the NaminContainer. You just need to go up the control tree. DropDownList > RepeaterItem > Repeater > RepeaterItem.
//dropdown in child repeater
var dropDownInChildRepeater = (DropDownList)sender;
//repeater item in child repeater
var dropDownInChildRepeaterItem = (RepeaterItem)dropDownInChildRepeater.NamingContainer;
//child repeater
var childRepeater = (Repeater)dropDownInChildRepeaterItem.NamingContainer;
//repeateritem of parent repeater
var parentRepeaterItem = (RepeaterItem)childRepeater.NamingContainer;
//the item index of the parent repeateritem
var parentRepeaterItemIndex = parentRepeaterItem.ItemIndex;

Storing data from asp:listview to a string

I have already done a lot of research about this here in stackoverflow and in the msdn documentation, however, nothing has helped. I need to be able to select an item in my asp: listview and take that text that I select and put it into a string to be used later. Here's the code of my .aspx:
<li class="menu-item menu-item-has-children">
Undécimo
<ul runat="server" id="eleventhList" class="sub-menu">
<asp:ListView ID="listViewforEleventh" runat="server" OnItemCommand="listViewforEleventh_ItemCommand">
<ItemTemplate>
<a onserverclick="linkForEleven_ServerClick" runat="server" id="linkForEleven" href="ViewSchedule.aspx"> <asp:Label ID="eleventhGroupLabel" runat="server" Text="<%#Container.DataItem %>"></asp:Label> </a>
<asp:Label runat="server" ID="dataString"></asp:Label>
</ItemTemplate>
</asp:ListView>
</ul>
</li>
I'm populating the list view like this:
private void loadEleventh()
{
list = group.getGroupsByLevelService(11);
List<string> sublist = new List<string>();
foreach (var element in list)
sublist.Add(element.GroupName);
listViewforEleventh.DataSource = sublist;
listViewforEleventh.DataBind();
}
This works, but now I need to select the data (text) that is in the sp:ListView. I am doing it like this:
protected void linkForEleven_ServerClick(object sender, EventArgs e)
{
ListViewDataItem item = listViewforEleventh.Items[listViewforEleventh.SelectedIndex];
Label c = (Label)item.FindControl("dataString");
groupName = c.Text;
}
When I debugged my code I got an error of index out of range exception in the selectedIndex method with the value -1. How can I solve this? Or how can I take the data from the listview item and store it in a string in another way?
In your SelectedIndexChanged event handler, do this:
string valueToSave = YourListBox.SelectedValue.ToString();
Of course, you have to make sure that you have actually selected an item in the ListBox in order for there to be a value for YourListbox.SelectedValue. This is just an example of how to do this once. I don't know the details behind how you want to use this value, of course.

Databind repeater using Linq with group by

I need to bind a repeater with hierarchical data as follows:
Category1
- Item1
- Item2
Category2
- Item3
- Item4
I currently have a single dataset with the items as well as the category that each item belongs to.
I'm trying to learn Linq and was wondering if there was a way I can do the same using Linq?
Below is what I tried:
var groupbyfilter = from dr in dtListing.AsEnumerable()
group dr by dr["Category"];
DataTable dtFinal = dtListing.Clone();
foreach (var x in groupbyfilter)
x.CopyToDataTable(dtFinal, LoadOption.OverwriteChanges);
rptList.DataSource = dtFinal;
rptList.DataBind();
But trouble with it is it repeats category for each item.
You'll need a repeater nested inside another.
Do a distinct on the dtlisting selecting only the category field. Bind this to the outer repeater.
In the 2nd repeater, select data whose where condition has category field which equals to the value that is being databound to the repeater item. You'd have to handle this in the repeater's onitem_databound event.
Here is an example.
<%# Import Namespace="System.Data" %>
<asp:Repeater ID="Repeater1" runat="server" OnItemDataBound="Repeater1_ItemDataBound">
<ItemTemplate>
<div>
Category: <b><%# Container.DataItem%></b>
<asp:Repeater ID="Repeater2" runat="server">
<FooterTemplate>
<%="</ul>" %>
</FooterTemplate>
<HeaderTemplate>
<%= "<ul>"%>
</HeaderTemplate>
<ItemTemplate>
<li>
<%# ((Data.DataRow)Container.DataItem)[1] %>, <%# ((Data.DataRow)Container.DataItem)[0] %>
</li>
</ItemTemplate>
</asp:Repeater>
</div>
</ItemTemplate>
</asp:Repeater>
For this sample I used a csv as my datasource, and created a datatable using it. So my codebehind looks like:
using Microsoft.VisualBasic;
using System;
using System.Collections;
using System.Collections.Generic;
using System.Data;
using System.Diagnostics;
public class _Default : System.Web.UI.Page
{
DataTable csvData;
protected void Page_Load(object sender, System.EventArgs e)
{
csvData = Utils.csvToDataTable("data.csv", true);
GridView1.DataSource = csvData;
GridView1.DataBind();
Repeater1.DataSource =
(from x in csvData.AsEnumerable() select x["category"]).Distinct();
Repeater1.DataBind();
}
protected void Repeater1_ItemDataBound(object sender, System.Web.UI.WebControls.RepeaterItemEventArgs e)
{
if (e.Item.ItemType == ListItemType.Item |
e.Item.ItemType == ListItemType.AlternatingItem) {
Repeater rptr = (Repeater)e.Item.FindControl("Repeater2");
rptr.DataSource =
csvData.AsEnumerable().Where(x => x["category"].Equals(e.Item.DataItem));
rptr.DataBind();
}
}
}
You can either use nested repeaters like deostroll says, or specify a grouping field and have a group header in your ItemTemplate that's dynamically hidden (or rendered) every time your grouping field changes.
More detail in fernan's answer at http://forums.asp.net/t/1252235.aspx

Bind the datasource of a nested ListView to the parent's ListView datasource

I have triple-nested ListView controls on my asp.net page, each nested within another. I use the OnItemDataBound event in the 1st ListView to set the DataSource of the 2nd level ListView. The 3rd ListView is contained in the of the 2nd ListView. I want to assign the same DataSource to both the 2nd and 3rd level ListView datasource controls, but I cannot figure out how to access the 3rd level ListView in order to do that.
Here is some sample code to help visualize:
<asp:ListView id="level1" runat="server" OnItemDataBound="level1_ItemDataBound">
<layouttemplate>
<asp:PlaceHolder runat="server" ID="itemPlaceHolder"></asp:PlaceHolder>
</layouttemplate>
<itemtemplate>
<asp:ListView id="level2" runat="server">
<layouttemplate>
<asp:ListView id="level3" runat="server">
<layouttemplate>
<asp:PlaceHolder runat="server" ID="itemPlaceHolder"></asp:PlaceHolder>
</layouttemplate>
<itemtemplate>OUTPUT DATA FOR LEVEL 3</itemtemplate>
</asp:ListView>
</layouttemplate>
<itemtemplate>OUTPUT DATA FOR LEVEL 2</itemtemplate>
</asp:ListView>
OUTPUT DATA FOR LEVEL 1
</itemtemplate>
</asp:ListView>
The level1_ItemDataBound method finds the level2 control, casts it as a ListView, sets its DataSource and executes the DataBind. At this point I'm stuck trying to get Level3.DataSource to be set to the same as Level2.DataSource. Any help?
Before you call DataBind on the on the level2 listview, you should register an event handler on the level2's ItemDataBound event.
Some psuedo code:
protected void level1_ItemDataBound(object sender, ListViewItemEventArgs e)
{
var listView2 = (ListView) e.Item.FindControl("level2");
listView2.ItemDataBound += level2_ItemDataBound;
listView2.DataSource = myDataSource;
listView2.DataBind();
}
protected void level2_ItemDataBound(object sender, ListViewItemEventArgs e)
{
var listView3 = (ListView) e.Item.FindControl("level3");
listView3.DataSource = myDataSource;
listView3.DataBind();
}

Limit the number of results in a Nested ASP.NET ListView

Similar to my other question:
I have a ListView bound to a Dictionary. Then I have a nested ListView for the dictionary's value's integers.
I need to limit the number of items bound to the nested list to something like 5, and show a more button in the template.
I can't find a way to get the more button to work, and to correctly limit the number at the same time. I have it working as one or the other right now.
Any ideas? Thanks!
UPDATE:
The markup looks something like this:
<asp:ListView runat="server" ID="MainListView" ItemPlaceholderID="PlaceHolder2">
<LayoutTemplate>
<asp:PlaceHolder runat="server" ID="PlaceHolder2" />
</LayoutTemplate>
<ItemTemplate>
<h1>My Main ListView - <%# Eval("Key") %></h1>
<asp:ListView runat="server" ID="NestedListView" ItemPlaceholderID="PlaceHolder3"
DataSource='<%# Eval("Value") %>' >
<LayoutTemplate>
<h2>One of many Nested ListViews</h2>
<asp:PlaceHolder runat="server" ID="PlaceHolder3" />
</LayoutTemplate>
<ItemTemplate>
<asp:LinkButton runat="server" ID="AnInteger" Text='<%# Eval("value") %>'></asp:LinkButton>
<br />
</ItemTemplate>
</asp:ListView>
<asp:LinkButton runat="server" ID="uxMoreIntegers" Text="More..." Visible="false" OnClick="uxMoreIntegers_Click"></asp:LinkButton>
</ItemTemplate>
</asp:ListView>
DataBind the main ListView anyway you want.
DataBind the nested ListView programmatically in the ItemDataBound event for the main ListView
Code:
protected void uxListView_ItemDataBound(object sender, ListViewItemEventArgs e)
{
if (e.Item.ItemType == ListViewItemType.DataItem)
{
ListViewDataItem item = (ListViewDataItem)e.Item;
// Get the bound object (KeyValuePair from the dictionary)
KeyValuePair<string, List<int>> nestedIntegerList = (KeyValuePair<string, List<int>>)item.DataItem;
// Get our nested ListView for this Item
ListView nestedListView = (ListView)e.Item.FindControl("uxNestedListView");
// Check the number of items
if (nestedIntegerList.Value.Count > 5)
{
// There are more items than we want to show, so show the "More..." button
LinkButton button = (LinkButton)item.FindControl("uxMore");
button.Visible = true;
}
// Bind the nestedListView to wahtever you want
nestedListView.DataSource = nestedIntegerList.Value.Take(5);
nestedListView.DataBind();
}
}
The Take method will return the first 5 items in your list, but won't modify the list itself. You can then simply check the number of items in the list to determine if the more button needs to be enabled.
someList.Take(5); //use these items in your ListView
moreButton.Enabled = (someList.Count > 5);

Categories