This code and demonstration is based on this article.
Here is a working demo.
<%@ Page Language="VB" %>
<%@ Import Namespace="System.Data" %>
<%@ Import Namespace="System.Data.SqlClient" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
<script runat="server">
Protected Sub txtSlide_Changed(ByVal sender As Object, ByVal e As EventArgs)
Dim txtCurrentPage As TextBox = TryCast(sender, TextBox)
Dim rowPager As GridViewRow = GridView1.BottomPagerRow
Dim txtSliderExt As TextBox = CType(rowPager.Cells(0).FindControl("txtSlide"), TextBox)
GridView1.PageIndex = Int32.Parse(txtSliderExt.Text) - 1
End Sub
Protected Sub GridView1_DataBound(ByVal sender As Object, ByVal e As EventArgs)
Dim rowPager As GridViewRow = GridView1.BottomPagerRow
Dim slide As SliderExtender = CType(rowPager.Cells(0).FindControl("ajaxSlider"), SliderExtender)
slide.Minimum = 1
slide.Maximum = GridView1.PageCount
slide.Steps = GridView1.PageCount
End Sub
</script>
<html>
<head runat="server">
<title></title>
<style type="text/css">
body
{
font: normal 11px auto "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
background-color: #ffffff;
color: #4f6b72;
}
th {
font: bold 11px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
color: #4f6b72;
border-right: 1px solid #C1DAD7;
border-bottom: 1px solid #C1DAD7;
border-top: 1px solid #C1DAD7;
letter-spacing: 2px;
text-transform: uppercase;
text-align: left;
padding: 6px 6px 6px 12px;
background: #D5EDEF;
}
td {
border-right: 1px solid #C1DAD7;
border-bottom: 1px solid #C1DAD7;
background: #fff;
padding: 6px 6px 6px 12px;
color: #4f6b72;
}
td.alt
{
background: #F5FAFA;
color: #797268;
}
td.boldtd
{
font: bold 13px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
background: #D5EDEF;
color: #797268;
}
</style>
</head>
<body>
<form runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:GridView ID="GridView1" runat="server" AllowPaging="true" AutoGenerateColumns="false" PageSize="3"
DataKeyNames="ID" DataSourceID="SqlDataSource1" OnDataBound="GridView1_DataBound">
<Columns>
<asp:BoundField DataField="Title" HeaderText="Title" />
<asp:BoundField DataField="Director" HeaderText="Director" />
<asp:BoundField DataField="DateReleased" HeaderText="Date Released" DataFormatString="{0:d}" />
</Columns>
<PagerTemplate>
<asp:TextBox ID="txtSlide" runat="server" Text='<%# GridView1.PageIndex + 1 %>' AutoPostBack="true" OnTextChanged="txtSlide_Changed"/>
<cc1:SliderExtender ID="ajaxSlider" runat="server" TargetControlID="txtSlide" Orientation="Horizontal" />
<asp:Label ID="lblPage" runat="server" Text='<%# "Page " & (GridView1.PageIndex + 1) & " of " & GridView1.PageCount %>' />
<asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1">
<ProgressTemplate>
<img alt="Loading" src="/images/ajaxicons/loading.gif" />
</ProgressTemplate>
</asp:UpdateProgress>
</PagerTemplate>
</asp:GridView>
</ContentTemplate>
</asp:UpdatePanel>
<asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:MyDatabase%>"
ProviderName="System.Data.SqlClient" SelectCommand="SELECT [ID], [Title], [Director], [DateReleased] FROM [Movies]">
</asp:SqlDataSource>
</form>
</body>
</html>