Creating a Custom User Interface for Paging : ListView « Data Binding « ASP.NET Tutorial






  1. ASP.NET Tutorial
  2. Data Binding
  3. ListView
<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">

    protected void pg_PagerCommand(object sender, DataPagerCommandEventArgs e)
    {
        e.NewMaximumRows = e.Item.Pager.MaximumRows;
        switch (e.CommandName)
        {
            case "Previous":
                if (e.Item.Pager.StartRowIndex > 0)
                    e.NewStartRowIndex = e.Item.Pager.StartRowIndex - 2;
                break;

            case "Next":
                e.NewStartRowIndex = e.Item.Pager.StartRowIndex + 2;
                break;
        }
    }

</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title>DataPager Template</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>

        <asp:ListView
            ID="lstProducts"
            DataSourceId="srcProducts"
            runat="server">
            <LayoutTemplate>
                <ul>
                <asp:Placeholder
                    id="itemPlaceholder"
                    runat="server" />
                </ul>
                <asp:DataPager
                    id="pg"
                    PageSize="2"
                    Runat="server">
                    <Fields>
                        <asp:TemplatePagerField
                            OnPagerCommand="pg_PagerCommand">
                            <PagerTemplate>
                            <asp:LinkButton
                                id="lnkPrevious"
                                Text="Previous"
                                CommandName="Previous"
                                Runat="server" />
                            <asp:LinkButton
                                id="lnkNext"
                                Text="Next"
                                CommandName="Next"
                                Runat="server" />
                            </PagerTemplate>
                        </asp:TemplatePagerField>
                    </Fields>
                </asp:DataPager>

            </LayoutTemplate>
            <ItemTemplate>
                <li>
                <%# Eval("Title") %>
                </li>
            </ItemTemplate>
        </asp:ListView>

        <asp:SqlDataSource
            id="srcProducts"
            SelectCommand="SELECT Id, Title, Director FROM Product"
            ConnectionString='<%$ ConnectionStrings:Products %>'
            Runat="server" />

    </div>
    </form>
</body>
</html>


File: Web.config

<configuration>
  <connectionStrings>
    <add name="Products" 
         connectionString="Data Source=.\SQLEXPRESS;
         AttachDbFilename=|DataDirectory|MyDatabase.mdf;Integrated Security=True;User Instance=True" />
  </connectionStrings>
</configuration>








19.21.ListView
19.21.1.Using the LayoutTemplate and ItemTemplate
19.21.2.Use a ListView control to render an HTML table.
19.21.3.Displaying a photo gallery with a ListView control.
19.21.4.Selecting a Row
19.21.5.Sorting data with the ListView control.
19.21.6.Editing Database Data
19.21.7.Inserting new records with the ListView control.
19.21.8.Using a DataPager control with the ListView control.
19.21.9.Creating a Custom User Interface for Paging