A ListView vezérlőt többek között azért szeretjük, mert korrektül kézben lehet vele tartani a generált HTML kódot. Ha túl sok adatot szeretnénk vele megjeleníteni, akkor tipikusan DataPagert ragasztunk hozzá. De nézte már meg valaki, hogy mit művel a DataPager a generált HTML kódban?
Megmutatom, íme egy egyszerű lista megjelenítés lapozással:
<asp:ListView ID="ListView1" runat="server" DataSourceID="SqlDataSource1">
<ItemTemplate>
<li><%# Eval("Title") %></li>
</ItemTemplate>
<LayoutTemplate>
<ul runat="server">
<asp:PlaceHolder ID="itemPlaceholder" runat="server" />
</ul>
<div>
<asp:DataPager runat="server">
<Fields>
<asp:NumericPagerField />
</Fields>
</asp:DataPager>
</div>
</LayoutTemplate>
</asp:ListView>
A lista valóban szép lesz, de a lapozós részből ez kerül az oldalba:
<div>
<span>
<span>1</span>
<a href="javascript:__doPostBack('ListView1$ctl02$ctl00$ctl01','')">2</a>
<a href="javascript:__doPostBack('ListView1$ctl02$ctl00$ctl02','')">3</a>
<a href="javascript:__doPostBack('ListView1$ctl02$ctl00$ctl03','')">4</a>
<a href="javascript:__doPostBack('ListView1$ctl02$ctl00$ctl04','')">5</a>
<a href="javascript:__doPostBack('ListView1$ctl02$ctl00$ctl05','')">...</a>
</span>
</div>Biztos megvan ennek is a szépsége, az azonban szinte biztos, hogy a kereső robotok ezeket a linkeket nem fogják bejárni, így nem fogunk tudni ráguglizni a további oldalakon lévő tartalmakra.
A megoldás a QueryStringField tulajdonság alkalmazása a DataPagerben:
<asp:DataPager runat="server" QueryStringField="Oldal">
<Fields>
<asp:NumericPagerField />
</Fields>
</asp:DataPager>
Ebbe a tulajdonságba egy tetszőleges sztringet írhatunk, ami meg fog jelenni az URL-ben, például így:
http://localhost/SeoFriendlyPagerSample/Default.aspx?Oldal=5
A HTML kódban pedig így:
<div>
<span>
<span>1</span>
<a href="/SeoFriendlyPagerSample/Default.aspx?Oldal=2">2</a>
<a href="/SeoFriendlyPagerSample/Default.aspx?Oldal=3">3</a>
<a href="/SeoFriendlyPagerSample/Default.aspx?Oldal=4">4</a>
<a href="/SeoFriendlyPagerSample/Default.aspx?Oldal=5">5</a>
<a href="/SeoFriendlyPagerSample/Default.aspx?Oldal=6">...</a>
</span>
</div>
A dolog nyilván akkor válik igazán érdekessé, ha egy oldalon több lapozó vagy lapozandó vezérlő is van. Ha külön akarjuk kezelni őket, akkor nekünk kell gondoskodni arról, hogy a QueryStringField értéke különböző legyen. Gyanítom, hogy ezért nincs bekapcsolva ez a funkció alapértelmezés szerint…
Ami pedig a rengeteg -t illeti, a NumericPagerField RenderNonBreakingSpacesBetweenControls tulajdonságával ezek megszűntethetőek. Ebben az esetben a CurrentPageLabelCssClass és a NumericButtonCssClass tulajdonságokkal tudjuk az egyes linkek stílusát – például távolságát – megadni.