ListView control
is introduced in .net 3.5 and it provides the features of both GridView and
DataList. Like GridView it supports paging and sorting and like DataList it has
no predefined layout and you can design it with any layout. Unlike GridView and
DataList it supports insert.
The ListView control supports the following
templates:
Ø LayoutTemplate:-Used to specify the containing element for the contents of the ListView.
Ø ItemTemplate:-Used to format each item rendered by the ListView.
Ø ItemSeparatorTemplate:-Used to display content between each item rendered by the ListView.
Ø GroupTemplate:-Used to specify the containing element for a group of items rendered by the ListView.
Ø GroupSeparatorTemplate:-Used to display content between each group of items rendered by the ListView.
Ø EmptyItemTemplate:-Used to render content for the remaining items in a GroupTemplate.
Ø EmptyDataTemplate:-Used to specify content that is displayed when no items are returned from the ListView control’s data source.
Ø SelectedItemTemplate:-Used to specify the content displayed for the selected item in the ListView.
Ø AlternatingItemTemplate:-Used to render different content for alternating items in a ListView.
Ø EditItemTemplate:-Used to render content for editing an item in a ListView.
Ø InsertItemTemplate:-Used to render content for inserting a new item in a ListView.
ListView control has following
important properties:-
Property
|
Description
|
DataKeyNames
|
Used to specify names of the primary key
columns in the table
|
DataSource
|
Used to specify a dataset or DataReader as
source of data
|
DataSourceId
|
Used to specify a DataSource control as
source of data
|
EditIndex
|
Used to get or set index of the current
item in edit mode
|
Insertltem
|
Returns the insert item in ListView
|
Editltem
|
Used to get the item in edit mode
|
InsertltemPosition
|
Indicates where to display insert item in ListView
|
ItemPlacehlderld
|
Used to set id of item placeholder of ListView
|
Items
|
Collection of items in ListView
|
SelectedIndex
|
Used to get or set index of the current
item selected
|
SelectedValue
|
Returns primary key column value of
selected item
|
FooterRow and
HeaderRow
|
Used to get reference of and header row
|
Rows
|
Collection of rows
|
PageCount
|
Returns the number of pages in details view
or FormView
|
SelectedValue
|
Returns primary key column value of
selected item
|
ListView has following important events:-
Event
|
Description
|
ItemEditing
|
Raised
when user click on edit button
|
ItemInserting
|
Raised
when user click on insert button
|
ItemUpdating
|
Raised
when user click on update button
|
ItemDeleting
|
Raised
when user click on delete button
|
SelectedIndexChanging
|
Raised
when user click on select button
|
Sorting
|
Raised
when user click on column heading to sort the rows
|
ItemCancelling
|
Raised
when user click on cancel button
|
Example: - the following example
demonstrates how to work with ListView control.
1. Add a page to the website, take a ListView control on it, and set its id as ListView and within the html source of the page design layout for the ListView as follows.
<asp:ListView ID="ListView1" runat="server" InsertItemPosition="LastItem" EnableViewState="false" OnItemCanceling="ListView1_ItemCanceling" OnItemDeleting="ListView1_ItemDeleting" OnItemEditing="ListView1_ItemEditing" OnItemInserting="ListView1_ItemInserting" OnItemUpdating="ListView1_ItemUpdating">
<LayoutTemplate>
<table>
<tr>
<th>
</th>
<th>
User Name
</th>
<th>
Email-Id
</th>
<th>
Full Name
</th>
</tr>
<tr>
<asp:PlaceHolder ID="itemPlaceholder" runat="server"></asp:PlaceHolder>
</tr>
<tr>
<asp:DataPager ID="DataPager1" runat="server" PageSize="2">
<Fields>
<asp:NumericPagerField ButtonCount="3" ButtonType="Link" />
</Fields>
</asp:DataPager>
</tr>
</table>
</LayoutTemplate>
<ItemTemplate>
<tr>
<td>
<asp:LinkButton ID="LnkEdit" runat="server" Text="Edit" CommandName="Edit"/>
<asp:LinkButton ID="LnkDelete" runat="server" Text="Delete" CommandName="Delete"/>
</td>
<td>
<asp:Label ID="Lblname" runat="server" Text='<%#Eval("username") %>'></asp:Label>
</td>
<td>
<asp:Label ID="LblEmail" runat="server" Text='<%#Eval("email") %>'></asp:Label>
</td>
<td>
<asp:Label ID="Lblfullname" runat="server" Text='<%#Eval("fullname") %>'></asp:Label>
</td>
</tr>
</ItemTemplate>
<EditItemTemplate>
<tr>
<td>
<asp:LinkButton ID="LnkUpdate" runat="server" Text="Update" CommandName="Update"/>
<asp:LinkButton ID="LnkCancel" runat="server" Text="Cancel" CommandName="Cancel"/>
</td>
<td>
<asp:Label ID="Lblname" runat="server" Text='<%#Eval("username") %>'></asp:Label>
</td>
<td>
<asp:TextBox ID="Txtemail" runat="server" Text="<%# Bind('email')%>" />
</td>
<td>
<asp:TextBox ID="Txtfullname" runat="server" Text="<%# Bind('fullname')%>" />
</td>
</tr>
</EditItemTemplate>
<InsertItemTemplate>
<tr>
<td>
<asp:LinkButton ID="LblInsert" runat="server" Text="Insert" CommandName="Insert" />
<asp:LinkButton ID="LnkCancel" runat="server" Text="Cancel" CommandName="Cancel" />
</td>
<td>
<asp:TextBox ID="Txtname" runat="server" Text="<%# Bind('username')%>" />
</td>
<td>
<asp:TextBox ID="Txtemail" runat="server" Text="<%# Bind('email')%>" />
</td>
<td>
<asp:TextBox ID="Txtfname" runat="server" Text="<%# Bind('fullname')%>" />
</td>
</tr>
</InsertItemTemplate>
</asp:ListView>
2. Now In the web.config file create the connection string as:
<connectionStrings><add name="constr"
connectionString="uid=sa;pwd=nagesh;database=nagesh;" providerName="System.Data.SqlClient"/>
</connectionStrings>
3. Within the code of the page globally declare objects for the classes SqlConnection, SqlDataAdapter, SqlCommandBuilder and DataSet and then create a method with name filllist as follows and call it in page load event.
SqlConnection cn = new SqlConnection(WebConfigurationManager.ConnectionStrings["constr"].ConnectionString);
SqlDataAdapter da;
SqlCommandBuilder cmb;
DataSet
ds;
protected
void Page_Load(object sender, EventArgs e)
{
filllist();
}
public
void filllist()
{
da = new SqlDataAdapter("select * from
account", cn);
cmb = new SqlCommandBuilder(da);
ds = new DataSet();
da.Fill(ds, "account");
ListView1.DataSource = ds.Tables["account"];
ListView1.DataBind();
}
4. Write the following code within the item inserting event of the ListView.
protected void ListView1_ItemInserting(object sender, ListViewInsertEventArgs e)
{
TextBox
t1 = e.Item.FindControl("Txtname") as TextBox;
TextBox
t2 = e.Item.FindControl("Txtemail") as TextBox;
TextBox
t3 = e.Item.FindControl("Txtfname") as TextBox;
DataRow
dr = ds.Tables["account"].NewRow();
dr[0] = t1.Text;
dr[1] = t2.Text;
dr[2] = t3.Text;
ds.Tables["account"].Rows.Add(dr);
da.Update(ds,"account");
filllist();
}
5. Write the following code within the item cancelling, item editing and item updating events of the ListView.
protected void ListView1_ItemCanceling(object sender, ListViewCancelEventArgs e)
{
ListView1.EditIndex
= -1;
filllist();
}
protected void ListView1_ItemEditing(object sender, ListViewEditEventArgs e)
{
ListView1.EditIndex
= e.NewEditIndex;
filllist();
}
protected void ListView1_ItemUpdating(object sender, ListViewUpdateEventArgs e)
{
ListViewItem lv =
ListView1.Items[e.ItemIndex];
TextBox t2 = ListView1.FindControl("Txtemail") as TextBox;
TextBox t3 = ListView1.FindControl("Txtfname") as TextBox;
DataRow dr = ds.Tables["account"].Rows[e.ItemIndex];
dr[1] = t2.Text;
dr[2] = t3.Text;
da.Update(ds, "account");
ListView1.EditIndex
= -1;
filllist();
}
6. Write the following code with n the item deleting event if the ListView
protected void ListView1_ItemDeleting(object sender, ListViewDeleteEventArgs e)
{
ds.Tables["account"].Rows[e.ItemIndex].Delete();
da.Update(ds, "account");
filllist();
}
No comments:
Post a Comment