[ASP.NET] Réaliser une pagination avec un objet DataList
Un des soucis lors de l’utilisation d’un Datalist demeure la pagination. En effet, le contrôle ne nous offre pas un événement de pagination comme c’est le cas pour un Gridview par exemple. Cependant, la solution existe. On peut désormais appliquer une pagination sur un Datalist et ceci en utilisant la classe PagedDataSource. On détaillera dans ce que suit comment procéder.
Voici un exemple d’un Datalist qui prend comme source une liste contenant des URLs des images:
<asp:DataList runat="server" id="dlGallery" RepeatColumns="4" RepeatDirection="Horizontal">
<ItemTemplate>
<img src="<%# Eval(Container.DataItem)%>" width="90" height="90">
</ItemTemplate>
</asp:DataList>
On déclare une variable statique (Si on a un contexte web, on utilise un ViewState pour palier au problème d' utilisation multiple de la variable) :
private static int CurrentPage = 0;
Dans le code Behind de la page, au niveau de la fonction qui remplit la Datalist :
BinderDataList(){
List<String> olstUrls = DictionnaryHelper.GetUrls();
//Déclaration de l’objet de la pagination et mettre à vrai la pagination
PagedDataSource objPage = new PagedDataSource();
objPage.AllowPaging = true;
//assigner la source de données à l’objet
objPage.DataSource = olstUrls;
//Spécifier le nombre de page pour la pagination
objPage.PageSize = 8;
//"CurrentPage" est une variable statique indiquant la page courante de la pagination
objPage.CurrentPageIndex = CurrentPage;
//lbtnNext et lbtnPrev sont deux boutons pour le "Suivant" et "Précédent" sur les éléments
lbtnNext.Enabled = !objPage.IsLastPage;
lbtnPrev.Enabled = !objPage.IsFirstPage;
//Assigner l’objet à la List
dlGallery.DataSource = objPage;
dlGallery.DataBind();
}
On spécifie après les événements des deux objets "Linkbutton" qui serviront pour naviguer entre les éléments de la liste:
private void lbtnPrev_Click(object sender, System.EventArgs e){
CurrentPage -=1;
BinderDataList();
}
private void lbtnNext_Click(object sender, System.EventArgs e){
CurrentPage +=1;
BinderDataList();
}
Et voila , on place les deux LinkButtons dans notre page et ainsi nous obtenons une pagination sur notre Datalist. On peut bien sur améliorer tout ça pour obtenir un pager du style |< < ... 4 5 6 7 8 ... > >|
PS: Merci à O. Nouiri pour cette astuce.
Ce post vous a plu ? Ajoutez le dans vos favoris pour ne pas perdre de temps à le retrouver le jour où vous en aurez besoin :