This tutorial will server as an introduction to the new Control added to the 3.5 .NET Framework.The ListView Control is a new addition to the .NET Framework
3.5 and this tutorial will serve as an introduction to this Data
Control and what we can use it for.
ListView Control in ASP.NET 3.5
This tutorial will server as an introduction to the new Control added to the 3.5 .NET Framework.
The ListView Control is a new addition to the .NET Framework
3.5 and this tutorial will serve as an introduction to this Data
Control and what we can use it for.
The ListView Control is somewhat of a hybrid of the existing Data
Controls in the .NET framework. We can use the ListView in many places
we have used the GridView, FormView, DataList, and Repeater before. The
ListView has entirely template-based like the Repeater, and has 11
templates to customize.
In this example, we will be looking at the LayoutTemplate, ItemTemplate, AlternatingItemTemplate and the EmptyDataTemplate.
Try Server Intellect for Windows Server Hosting. Quality and Quantity!
The LayoutTemplate is used for the containing element of the
ListView's contents; the ItemTemplate is used to specify how each item
is displayed; AlternatingItemTemplate is used to specify how every
other item is displayed; and the EmptyDataTemplate is used when there
is no data to display.
We start by creating a new web site in VS.NET 2008, and adding a SQL
Database to our project. For this example, we will use a table with
three columns - id, name and age. Once we have our database and some
sample data, we can begin. We will start by adding the ListView Control
and a SqlDataSource:
<form id="form1" runat="server">
<asp:ListView ID="ListView1" runat="server" DataSourceID="SqlDataSource1">
</asp:ListView>
<asp:SqlDataSource ID="SqlDataSource1" runat="server"
ConnectionString="<%$ ConnectionStrings:ConnectionString %>"
SelectCommand="SELECT * FROM [tblPeople]"></asp:SqlDataSource>
</form> |
Yes, it is possible to find a good web host. Sometimes it takes a while. After trying several, we went with Server Intellect
and have been very happy. They are the most professional, customer
service friendly and technically knowledgeable host we've found so far.
We use the DataSource to select everything from our table in the
datbase, and then we assign the DataSource to the ListView. The
ListView control looks like every other ASP.NET Control, and works
similarly.
Next, we will add the first template, the LayoutTemplate:
<LayoutTemplate>
<div style="border:dotted 1px black;">
<asp:PlaceHolder ID="itemPlaceholder" runat="server" />
</div>
</LayoutTemplate> |
Server Intellect assists companies of all sizes with their hosting needs by offering fully configured server solutions coupled with proactive server management services. Server
Intellect specializes in providing complete internet-ready server
solutions backed by their expert 24/365 proactive support team.
This template specifies the container for the contents of the
ListView. We have put a PlaceHolder in here, but this will never get
rendered by the browser. The PlaceHolder will be replaced by the
contents of the ItemTemplate. We could - in theory - use any server
control with the ID of itemPlaceholder and it would work, but
PlaceHolder is generally the default control to use. Next, we define
the ItemTemplate and AlternatingItemTemplate:
| <ItemTemplate>
<%# Eval("name") %>, <%# Eval("age") %> %>
</ItemTemplate>
<AlternatingItemTemplate>
<div style="border:dotted 1px gray;background-color:silver;">
<%# Eval("name") %>, <%# Eval("age") %>
</div>
</AlternatingItemTemplate> |
We use these templates to display the Name and Age from our database. Each record will use these templates.
Finally, we add the EmptyDataTemplate. This will be used if there is no data returned from the database:
| <EmptyDataTemplate>
Sorry, no data to display.
</EmptyDataTemplate> |
We migrated our web sites to Server Intellect
over one weekend and the setup was so smooth that we were up and
running right away. They assisted us with everything we needed to do
for all of our applications. With Server Intellect's help, we were able to avoid any headaches!
After we have added these templates, we can run the web application
to see what we have. We should have a tabular view of records output
from the database, with alternating styled cells (divs).
The ASPX code will look something like this:
<form id="form1" runat="server">
<asp:ListView ID="ListView1" runat="server" DataSourceID="SqlDataSource1">
<LayoutTemplate>
<div style="border:dotted 1px black;">
<asp:PlaceHolder ID="itemPlaceholder" runat="server" />
</div>
</LayoutTemplate>
<ItemTemplate>
<%# Eval("name") %>, <%# Eval("age") %>
</ItemTemplate>
<AlternatingItemTemplate>
<div style="border:dotted 1px gray;background-color:silver;">
<%# Eval("name") %>, <%# Eval("age") %>
</div>
</AlternatingItemTemplate>
<EmptyDataTemplate>
Sorry, no data to display.
</EmptyDataTemplate>
</asp:ListView>
<asp:SqlDataSource ID="SqlDataSource1" runat="server"
ConnectionString="<%$ ConnectionStrings:ConnectionString %>"
SelectCommand="SELECT * FROM [tblPeople]"></asp:SqlDataSource>
</form> |
|