Tutorial shows how to add page links to your Repeater control and make use of QueryString to move between pages. VB version.
The Repeater control is one of the most powerful controls in the ASP.NET toolbox. However, there is no built-in method of creating pages to display with it, like the GridView, for example. Building a pager for the Repeater control is possible in more than one ways, but if we use PostBack, then the result is not really SEO-friendly.
Need help with Windows Dedicated Hosting? Try Server Intellect. I'm a happy customer!
An alternative to using PostBack is to use a QueryString for the page numbers. This tutorial will show how we can do this, based upon data in the Repeater.
First, add the following assembly references:
| Imports System Imports System.Data Imports System.Configuration Imports System.Web Imports System.Web.Security Imports System.Web.UI Imports System.Web.UI.WebControls Imports System.Web.UI.WebControls.WebParts Imports System.Web.UI.HtmlControls Imports System.Data.SqlClient |
For this example, we use a sample database. Add the connection string in the Web.Config similar to the following:
| <appSettings> <add key="ConnectionString" value="Data Source=.\SQLEXPRESS;AttachDbFilename=|DataDirectory|\Database.mdf;Integrated Security=True;User Instance=True" /> </appSettings> |
Yes, it is possible to find a good web host. Sometimes it takes a while. After trying several, we went with Server Intellect and have been very happy. They are the most professional, customer service friendly and technically knowledgeable host we've found so far.
Next, we add the following to the ASPX page (a Repeater) and a Label:
| <form id="form1" runat="server"> <div> </form> <asp:Label ID="lblCurrpage" runat="server"></asp:Label> <asp:Repeater ID="Repeater1" runat="server"> <HeaderTemplate><table width="100%"><tr><th>Name</th><th>City</th></tr></HeaderTemplate> </asp:Repeater><ItemTemplate> <tr><td><%#DataBinder.Eval(Container.DataItem, "name")%></td> </ItemTemplate><td><%#DataBinder.Eval(Container.DataItem, "city")%></td></tr> <FooterTemplate></table></FooterTemplate> </div> |
If you're looking for a really good web host, try Server Intellect - we found the setup procedure and control panel, very easy to adapt to and their IT team is awesome!
The code-behind should look something like this:
| Imports System Imports System.Data Imports System.Configuration Imports System.Web Imports System.Web.Security Imports System.Web.UI Imports System.Web.UI.WebControls Imports System.Web.UI.WebControls.WebParts Imports System.Web.UI.HtmlControls Imports System.Data.SqlClient Partial Class _Default Inherits System.Web.UI.Page End Class Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load DisplayData() End SubPublic Sub DisplayData() Dim myConnection As New SqlConnection(ConfigurationManager.AppSettings("ConnectionString")) End SubDim cmd As New SqlCommand("SELECT * FROM [Table1]", myConnection) cmd.Connection.Open() Dim myDA As New SqlDataAdapter(cmd) Dim ds As New DataSet() myDA.Fill(ds, "Table1") Dim pageds As New PagedDataSource() pageds.DataSource = ds.Tables("Table1").DefaultView pageds.AllowPaging = True pageds.PageSize = 3 Dim curpage As Integer = 0 If Request.QueryString("page") IsNot Nothing Then curpage = Convert.ToInt32(Request.QueryString("page")) Else curpage = 1 End Ifpageds.CurrentPageIndex = curpage - 1 If curpage = 1 AndAlso pageds.DataSourceCount > pageds.PageSize Then lblCurrpage.Text = "Pages: 1" ElseIf pageds.DataSourceCount = 0 Then lblCurrpage.Text = "No data to display." ElseIf curpage > 1 AndAlso pageds.DataSourceCount > pageds.PageSize Then lblCurrpage.Text = "Pages: <a href='Default.aspx?page=1'>1</a>" End IfFor i As Integer = 2 To pageds.PageCount If i = curpage Then Next ilblCurrpage.Text = lblCurrpage.Text & ", " & i.ToString() Else lblCurrpage.Text = lblCurrpage.Text & ", <a href='Default.aspx?page=" & i.ToString() & "'>" & i.ToString() & "</a>" End IfRepeater1.DataSource = pageds Repeater1.DataBind() cmd.Connection.Close() cmd.Connection.Dispose() |
No comments:
Post a Comment