Saturday 31 August 2013

List View in ASP.net..

 
In this article I'm trying to explain what is ListView control, what is the Use of ListView Controller. How it works and How to bind data ListView. What are the different types of templates include in that.?


ListView features:



ListView is the new control and it's available from FrameWork 3.5 onwords. It is used to display table format of data, the difference between other controls and ListView control is we can create Template based layouts in ListView but using other controls we can't do that. It gives any type of data like Columns (DataList) , Faster execution (Repeater) , Table format of data (GridView), inbuilt insertion (FormView)option.


Which is Richest Control:


ListView is the Richest Control not GridView. Why because GridView give only table format of data but listview give any type of output like DataList,Repeater,GridView,FormView...


Templates to Design a page:



There are several templates to design a page in that we discuss few points
  • LayoutTemplate
  • ItemTemplate
  • AlternatingItemTemplate
  • DataPager

1) LayoutTemplate:


It is used to give header of the control. Normally for GridView and other control to display header we use HeaderTemplate but in ListView using LayoutTemplate we give Header.

2)ItemTemplate:


It is used to display the content of the page.

3) AlternatingItemTemplate:


Using this template we give some styles for Alternating rows.

4) DataPager:


Using this control we give pagging to the control.


Features:



  • Built in support for Sorting
  • Built in support for insertion.
  • Display any format of data.
  • DataPager
  • We can define our own Template / Layouts.
  • We can Edit,Delete,Update the records same like other controls.


Source Code:



<%@ Page Language="C#" AutoEventWireup="true" CodeFile="ListView.aspx.cs" Inherits="ListView" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <style type="text/css">
        .style1
        {
            font-size: x-large;
            color: #CC3300;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div align="center">
    
        <span class="style1"><strong><em>Working with ListView control</em></strong></span><br />
        <br />
        <br />
                <asp:Label ID="lblName" runat="server" Text="Dept Name :"></asp:Label>
        
        <asp:TextBox ID="txtName" runat="server"></asp:TextBox>
        <br />
        <asp:Label ID="lblLoc" runat="server" Text="Location :"></asp:Label>
            
        <asp:TextBox ID="txtLoc" runat="server"></asp:TextBox>
        <br />
        <br />
        <br />
         
        <asp:Button ID="btnInsert" runat="server" onclick="btnInsert_Click" Text="Insert" />
        <br />
        <br />
        <asp:ListView ID="ListView1" runat="server" >
            <LayoutTemplate>
                <table ID="itemPlaceholderContainer" cellpadding="0" cellspacing="1" border="0" width="50%" >
                    <tr>
                        <th width="50%" align="center" style="background-color:Blue; color:White;"> Department Name</th>
                        <th width="50%" align="center" style="background-color:Blue; color:White;"> Location</th>
                    </tr>
                    <tr runat="server" ID="itemPlaceholderContainer">
                    </tr>

                </table>
                
            </LayoutTemplate>
            <ItemTemplate>
                <table cellpadding="0" cellspacing="1" border="0" width="50%">
                    <tr>
                        <td align="center" width="50%">
                             <%#Eval("dname") %>   
                        </td>
                        <td align="center" width="50%">
                              <%#Eval("loc") %>
                        </td>
                    </tr>
                </table>
                    
            </ItemTemplate>
            <AlternatingItemTemplate>
                <table width="50%">
                    <tr align="center" id="tr" runat="server" style="background-color:#D4DFE1">                        
                        <td align="center" width="50%">
                             <%#Eval("dname") %>   
                        </td>
                        <td align="center" width="50%">
                              <%#Eval("loc") %>
                        </td>                                                                       
                    </tr>
                </table>
            </AlternatingItemTemplate>
                 
        </asp:ListView>
        <asp:DataPager ID="DataPager1" runat="server" PageSize="5" PagedControlID="ListView1" OnPreRender="DataPager1_PreRender">
            <Fields>
                <asp:NextPreviousPagerField ShowFirstPageButton="true" FirstPageText="First"
                                            ShowNextPageButton="true" NextPageText=" >"
                                            ShowLastPageButton="true" LastPageText="Last"
                                            ShowPreviousPageButton="true" PreviousPageText="<" />
            </Fields>
        </asp:DataPager>
        <br />
        <br />
        
    </div>
    </form>
</body>
</html>

Code Behind:



using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
using System.Data.SqlClient;

public partial class ListView : System.Web.UI.Page
{
    SqlConnection con = new SqlConnection("DataBase=ENGSOFT;User id=sa;Password=P@ssword9");
    SqlDataAdapter da;
    DataSet ds;
    SqlCommand cmd;
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            Bind_GV();
        }
    }
    protected void btnInsert_Click(object sender, EventArgs e)
    {
        Insert_Data();
        Clear();
    }
    protected void Bind_GV()
    {
        con.Open();
        da = new SqlDataAdapter("select deptno,dname,loc from DEPT", con);
        ds = new DataSet();
        da.Fill(ds);

        con.Close();
        ListView1 .DataSource = ds;
        ListView1.DataBind();
    }
    protected void Insert_Data()
    {
        con.Open();
        da = new SqlDataAdapter("insert into Dept values(@dname,@loc)", con);
        cmd = new SqlCommand("insert into Dept values(@dname,@loc)", con);
        cmd.Parameters.AddWithValue("@dname", txtName.Text);
        cmd.Parameters.AddWithValue("@loc", txtLoc.Text);
        cmd.ExecuteNonQuery();
        ds = new DataSet();
        con.Close();
        Bind_GV();
        Clear();
    }
    protected void Clear()
    {
        txtLoc.Text = "";
        txtName.Text = "";
    }
    protected void DataPager1_PreRender(object sender, EventArgs e)
    {
        Bind_GV();
    }
}

OutPut:

 

Conclusion:

 
Using ListView control we can display any format of Data. This is great approach to do any format of output. Using this control we do sorting, Inserting, Pagging and everything. This is the Richest control.

No comments:

Post a Comment