How to Edit List view template

How to Editview template in asp.net:

In Asp.net Programming Edit List view template according to the developer or use is not very typical task but for this first we remember to the structure of the data base table and also in which way we want to display data in the page . And for this first understand why we want to display data, what data is, what audience is, and which type we need it.

Edit Listview template

In this post we make table in the list view and then bind data from the data base. The table data base table description is given in the old related post.


Now In this post we give some points for binding data form data base in List View. 
in this post we make style for formatting to the table in list view and apply this style in code.

How to Edit List view template in asp.net

How to Edit List view template in asp.net

Code :

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

<!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 id="Head1" runat="server">
    <title>List View Template table - how to use table for List View layout</title>
    <style type="text/css">
        .ContainerTableCSS
        {
            background-color: Maroon;
            width: 504px;
        }
        .TableHeader
        {
            background-color: Maroon;
            color: White;
            font-size: large;
            font-family: Times New Roman;
            height: 45px;
            text-align: center;
        }
        .ItemCSS
        {
            background-color: Navy;
            color: White;
            font-family: MS Sans Serif;
            font-size: medium;
            font-weight: bold;
            height: 28px;
        }
        .ItemSeparatorCSS
        {
            background-color: White;
            height: 2px;
        }
        .style1
        {
            width: 276px;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server"> 
    <div> 
        <h2 style=" font-style:italic;">ListView Example: How To Use ItemSeparatorTemplate</h2> 
        <hr width="625" align="left"  /> 
        <asp:SqlDataSource  
            ID="SqlDataSource1" 
            runat="server" 
            ConnectionString="<%$ ConnectionStrings:PastConnectionString %>" 
            SelectCommand="SELECT [name], [post] FROM [Post_table]" 
            > 
        </asp:SqlDataSource> 
        <br /> 
        <asp:ListView  
            ID="ListView1" 
            runat="server" 
            DataSourceID="SqlDataSource1" 
            DataKeyNames="name" 
            > 
              
            <LayoutTemplate> 
                <table id="Table1" runat="server" class="ContainerTableCSS"> 
                    <tr id="Tr1" runat="server" class="TableHeader"> 
                        <td id="Td1" runat="server">name</td> 
                        <td id="Td2" runat="server">post</td> 
                       
                    </tr> 
                    <tr id="ItemPlaceholder" runat="server"> 
                    </tr> 
                </table> 
            </LayoutTemplate> 
            <ItemTemplate> 
                <tr class="ItemCSS"> 
                    <td> 
                        <asp:Label  
                            ID="Label1" 
                            runat="server" 
                            Text='<%# Eval("name")%>' 
                            > 
                        </asp:Label> 
                    </td> 
                    <td> 
                        <asp:Label  
                            ID="Label2" 
                            runat="server" 
                            Text='<%# Eval("post")%>' 
                            > 
                        </asp:Label> 
                    </td> 
                     
                </tr>                 
            </ItemTemplate> 
            <ItemSeparatorTemplate> 
                <tr> 
                    <td colspan="2" class="ItemSeparatorCSS"></td> 
                </tr> 
            </ItemSeparatorTemplate> 
        </asp:ListView>  
    </div> 
    </form> 
</body>
</html> 


 Reference :


Comments

Popular posts from this blog