subject: Listview And Templates [print this page] ListView and Templates ListView is a fantastic control when you want to render the tabular data in a customized way. It gives you a lot of templates to work with. These templates will improve the most used functionalities. This article explains about one of them, which is GroupTemplate.
What is not covered?
The basic functionalities of ListView and how to bind the data to DataSource from SQL database are not covered in this article. Please refer to the ASP.Net Data Controls section for that.
LayoutTemplate
This template is used mainly for determining the basic layout the control supposed to render. So in our case this will hold the groups. Further groups hold their respective items. Hence we need to specify the GroupPlaceholderID to the layout template not to the GroupTemplate. I have placed a silver colored (as a background) box to contain all group boxes.
GroupItemCount
Without this property the grouping will not be applied. So specify a number bigger than 1. I have used GroupItemCount as 5. So every 5 items in the list will be grouped.
Source Code
Private Sub BindListView()
ListView1.DataSource = GetData(String.Empty)
ListView1.DataBind()
End Sub
GridView inside a ListView ListView is a very flexible control for rendering custom formatted outputs. I have already managed it to get a horizontal menu with liquid layout. Its fantastic set of templates allows most of the rendering to be easily done. With a little bit of CSS knowledge we can avoid rendering tables for most of the lists. It is not only flexible in rendering, but also very good in handling controls inside its template. To explain this i have placed a GridView inside ItemTemplate to load in all cells.
Asp.net ListView ItemDataBound to load GridView
For explaining the usage of listview ItemDataBound, I have chosen a GridView to be placed in a template (fetched using findcontrol). So based on the ListViews values the GridView will be populated. As usual, I have taken Northwind as a sample db. Further Category and products tables are selected for ListView and GridView respectively. Initially categories will be loaded into the ListView, and then Products will be loaded into the GridView contained in the respective cell of the ListView. Refer the following picture for the expected output.
