Tuesday, March 17, 2015

ListView implement paging with css

The ListView display data in the database and implement paging

Abstract: ListView class with user-defined template to display the value of the data source. ListView control enables users to select, sort, delete, edit and insert records.

Code list:

view plain
<%@ Page language="C#" %>  
    "  
<html  >  
  <head id="Head1" runat="server">  
    <title>ListView Example</title>  
    <style type="text/css">  
      .CurrentPage   
      {  
          padding: 2px 6px;  
          border: solid 1px #ddd;   
          background: #2E8B57;  
          color:White;  
      }  
      .PrevNext,.PageNumber  
      {  
          padding: 2px 6px;  
          border: solid 1px #ddd;  
          text-decoration: none;  
          color: #2E8B57;  
      }  
      .PageNumber:hover, .PrevNext:hover  
      {  
          background-color: #FFA500;  
          color: White;  
      }  
      
    </style>  
  </head>  
  <body>  
    <form id="form1" runat="server">  
      <h3>ListView Example</h3>  
  
      <asp:ListView ID="VendorsListView"  
        DataSourceID="LinqDataSource1"  
        DataKeyNames="CustomerID"  
        runat="server">  
        <LayoutTemplate>  
        <%--? table?div  span ?? ItemTemplate    
            GroupTemplate ?  DataPager ?  
        --%>  
          <table cellpadding="2" width="640px" border="1" ID="tbl1" runat="server">  
            <tr id="Tr1" runat="server" style="background-color: #98FB98">  
              <th id="Th1" runat="server">CustomerID</th>  
              <th id="Th2" runat="server">NameStyle</th>  
              <th id="Th3" runat="server">Title</th>  
            </tr>  
            <%-- ListView“VendorsListView”? ID “itemPlaceholder”?  
             runat="server"--%>  
            <tr runat="server" id="itemPlaceholder" />  
          </table>  
           <%--DataPager : IPageableItemContainer ? ListView ??--%>  
          <asp:DataPager ID="DataPager1" runat="server">  
             <%--  DataPagerField ? DataPager ?--%>  
            <Fields>  
           <%-- NumericPagerField  DataPager ?--%>  
              <asp:NumericPagerField   
              PreviousPageText="< Prev"  
              NextPageText="Next >"  
              ButtonCount="10"  
              NextPreviousButtonCssClass="PrevNext"  
              CurrentPageLabelCssClass="CurrentPage"  
              NumericButtonCssClass="PageNumber" />  
            </Fields>  
          </asp:DataPager>  
        </LayoutTemplate>  
        <%--?--%>  
        <ItemTemplate>  
          <tr id="Tr2" runat="server">  
            <td>  
              <asp:Label ID="VendorIDLabel" runat="server" Text='<%# Eval("CustomerID") %>' />  
            </td>  
            <td>  
              <asp:Label ID="AccountNumberLabel" runat="server" Text='<%# Eval("NameStyle") %>' />  
            </td>  
            <td>  
              <asp:Label ID="NameLabel" runat="server" Text='<%# Eval("Title") %>' /></td>  
          </tr>  
        </ItemTemplate>  
      </asp:ListView>  
    <asp:LinqDataSource ID="LinqDataSource1" runat="server"   
              ContextTypeName="WebApplication5.DataClasses1DataContext"   
              Select="new (CustomerID, NameStyle, Title, FirstName)" TableName="Customer">  
    </asp:LinqDataSource>      
  
    </form>  
  </body>  
</html>  

March 17, 2015 Asp.net 4.5 0

vijayanandgawle

Tuesday, March 17, 2015

ListView implement paging with css

The ListView display data in the database and implement paging

0 comments:

Popular Posts

Recent Posts

Categories

Unordered List

Text Widget

Blog Archive