Paging with a DataGrid Demo

This demo illustrates how to page records using a DataGrid Web control. Keep in mind that every time the user requests to move to another page, the entire DataSet is repopulated and rebound to the DataGrid. The UI of the DataGrid and the paging controls can be easily changed with minor edits of the source code below.

Viewing the Paged Results of SELECT FAQID, Description, DateEntered, ViewCount FROM tblFAQ ORDER BY FAQID


FAQ IDQuestionDate AddedPage Views
2How do you convert a string to all uppercase or all lowercase?9/23/200038,856
7How do I dynamically resize an array?9/23/200057,059
8How do you create a database table through a SQL statement (via an ASP page, perhaps)?9/24/200060,525
10How can I tell what version of ADO I am using?9/24/200030,016
11How can I have my ASP page send HTML-formatted email?9/24/200047,485
12How can I display line breaks in an email message?9/24/200033,528
13How do you send email attachments through an ASP page?9/24/200095,542
14Can I send emails without using CDONTS?9/24/2000111,829
15How can I determine the length of a string (how many characters are in a string)?9/24/200031,401
16Using VBScript, how can I determine if a variable is a valid date or not?9/24/200038,431
17How can I find the position of a certain character (or substring) within a string?9/24/200051,391
18How can I easily display a nicely formatted date variable?9/24/200060,304
19How can I return the current date/time?9/24/200043,950
20What is recursion?9/24/200029,792
21How can I determine the upper or lower bounds of an array?9/24/200040,390
<< Prev. Page Next Page >>
Viewing Page 1 of 14

Source Code 
<% @Import Namespace="System.Data" %>
<% @Import Namespace="System.Data.SqlClient" %>
<script language="vb" runat="server">

	Sub Page_Load(sender as Object, e as EventArgs)
		If Not Page.IsPostBack then
			'We only want to bind the data on the first page load
			'Every subsequent postback will have the data rebound in
			'the dgPopularFAQs_Paged event handler
			BindData()
		End If	
	End Sub
	
	
	Sub BindData()
		'1. Create a connection
		Dim myConnection as New SqlConnection(ConfigurationSettings.AppSettings("connectionString"))

		'2. Create the command object, passing in the SQL string
		Const strSQL as String = "SELECT FAQID, Description, DateEntered, ViewCount FROM tblFAQ ORDER BY FAQID"
		Dim myCommand as New SqlCommand(strSQL, myConnection)

		'3. Create the DataAdapter
		Dim myDA as New SqlDataAdapter()
		myDA.SelectCommand = myCommand

		'4. Populate the DataSet
		Dim myDS as New DataSet()
		myDA.Fill(myDS)

		'Set the datagrid's datasource to the dataset and databind
		dgPopularFAQs.DataSource = myDS
		dgPopularFAQs.DataBind()	

		'Display information on what page we are currently viewing
		lblMessage.Text = "Viewing Page " & dgPopularFAQs.CurrentPageIndex+1 & _
						  " of " & dgPopularFAQs.PageCount
	End Sub


	Sub dgPopularFAQs_Paged(sender as Object , e as DataGridPageChangedEventArgs)
		dgPopularFAQs.CurrentPageIndex = e.NewPageIndex
		BindData()
    End Sub
</script>

<h1>Viewing the Paged Results of <code>SELECT FAQID, Description, DateEntered, ViewCount FROM tblFAQ ORDER BY FAQID</code></h1>

<form runat="server">
	<br>
	<asp:datagrid id="dgPopularFAQs" runat="server" BorderWidth="0"
			CellPadding="2" Width="100%"
			Font-Name="Verdana"
			Font-Size="Smaller"
			AutoGenerateColumns="False"
				
			HeaderStyle-HorizontalAlign="Center"
			HeaderStyle-Font-Bold="True"
			HeaderStyle-BackColor="Navy"
			HeaderStyle-ForeColor="White"
				
			AlternatingItemStyle-BackColor="#dddddd"
				
			AllowPaging="True"
			PageSize="15"
			OnPageIndexChanged="dgPopularFAQs_Paged">

		<PagerStyle Mode="NextPrev" HorizontalAlign="Right"
				ForeColor="White" BackColor="Navy" 
				NextPageText="Next Page >>" PrevPageText="<< Prev. Page">
		</PagerStyle> 			

		<Columns>
			
			<asp:BoundColumn HeaderText="FAQ ID" DataField="FAQID"
								ItemStyle-HorizontalAlign="Center" />
			<asp:BoundColumn HeaderText="Question" DataField="Description" />
			<asp:BoundColumn HeaderText="Date Added" DataField="DateEntered"
								DataFormatString="{0:d}" />
			<asp:BoundColumn HeaderText="Page Views" DataField="ViewCount"
								DataFormatString="{0:N0}"
								ItemStyle-HorizontalAlign="Right" />
			
		</Columns>

	
	</asp:datagrid>
	<asp:label HorizontalAlign="Center" runat="server" id="lblMessage"
			Font-Name="Verdana" Font-Italic="True" Font-Size="Smaller" />
</form>

[Return to the article]