How to use PagingBulletedListExtender in asp.net ajax


PagingBulletedListExtender in asp.net ajax



PagingBulletedListExtender is an asp.net ajax control toolkit's extender control. PagingBulletedListExtender control can
be attached to an asp.net BulletedList web server control and provide client side sorted paging.




PagingBulletedListExtender control have the following properties those are TargetControlID, ClientSort, IndexSize,
MaxItemPerPage, Separator, SelectIndexCssClass and UnselectIndexCssClass.




PagingBulletedListExtender control's TargetControlID property specify the BulletedList server control which we want to extend
as a sorted paging bulleted list. ClientSort property specify whether extended BulletedList control's items should be sorted
client side.




IndexSize property set the number of characters in the index headings should be appear in extended bulltedlist control. This
property is ignored if MaxItemPerPage property have a value. MaxItemPerPage property allow us to set maximum number of items
per page will display in extended BulletedList control. Separator property set the separator text between indices.




ASP.NET developers can change the default look and feel of extended BulltedList control using CSS classes. SelectIndexCssClass
represent a CSS class that we can apply for selected index design. UnselectIndexCssClass property apply a CSS class for
indices that are not selected.




UsingPagingBulletedListExtender.aspx



<%@ Page Language="C#" AutoEventWireup="true" %>

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>

<!DOCTYPE html>

<script runat="server">

</script>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
<title>Ajax PagingBulletedListExtender - How to use PagingBulletedListExtender in asp.net ajax</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<h2 style="color:DarkBlue; font-style:italic;">Ajax Control ToolKit Example: PagingBulletedListExtender</h2>
<hr width="575" align="left" color="CornFlowerBlue" />
<br /><br />
<asp:ScriptManager
ID="ScriptManager1"
runat="server"
>
</asp:ScriptManager>
<cc1:PagingBulletedListExtender
ID="PagingBulletedListExtender1"
runat="server"
TargetControlID="BulletedList1"
>
</cc1:PagingBulletedListExtender>
<asp:SqlDataSource
ID="SqlDataSource1"
runat="server"
ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
SelectCommand="Select ProductID, ProductName From Products"
>
</asp:SqlDataSource>
<asp:BulletedList
ID="BulletedList1"
runat="server"
DataSourceID="SqlDataSource1"
DataTextField="ProductName"
DataValueField="ProductID"
ForeColor="DodgerBlue"
>
</asp:BulletedList>
</div>
</form>
</body>
</html>