Keresőbarát lapozás

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>&nbsp;
            <a href="javascript:__doPostBack('ListView1$ctl02$ctl00$ctl01','')">2</a>&nbsp;
            <a href="javascript:__doPostBack('ListView1$ctl02$ctl00$ctl02','')">3</a>&nbsp;
            <a href="javascript:__doPostBack('ListView1$ctl02$ctl00$ctl03','')">4</a>&nbsp;
            <a href="javascript:__doPostBack('ListView1$ctl02$ctl00$ctl04','')">5</a>&nbsp;&nbsp;
            <a href="javascript:__doPostBack('ListView1$ctl02$ctl00$ctl05','')">...</a>&nbsp;
        </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>&nbsp;
            <a href="/SeoFriendlyPagerSample/Default.aspx?Oldal=2">2</a>&nbsp;
            <a href="/SeoFriendlyPagerSample/Default.aspx?Oldal=3">3</a>&nbsp;
            <a href="/SeoFriendlyPagerSample/Default.aspx?Oldal=4">4</a>&nbsp;
            <a href="/SeoFriendlyPagerSample/Default.aspx?Oldal=5">5</a>&nbsp;&nbsp;
            <a href="/SeoFriendlyPagerSample/Default.aspx?Oldal=6">...</a>&nbsp;
        </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 &nbsp;-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.


txt SeoFriendlyDataPagerSample.aspx.txt (1 kB)


Balássy György (MS RD, ASP.NET MVP, MCTS)

Balássy György (MS RD, ASP.NET MVP, MCTS) Villamosmérnök, a BME Automatizálási és Alkalmazott Informatikai Tanszékén webportálok fejlesztését oktatja. 2000 óta foglalkozik a Microsoft .NET platformjával, melynek meghonosításában jelentős szerepet vállalt előadóként, konzulensként és A .NET Framework és programozása című könyv társszerzőjeként. Az MSDN Kompetencia Központon belül a Portál Technológiák Csoport vezetője, szakterülete web alapú rendszerek fejlesztése és üzemeltetése. 2004-ben Magyarországon elsőként kapta meg a Most Valuable Professional címet, majd 2005 óta a Microsoft magyarországi regionális igazgatója. Publikációi a Technet Magazinban, az MSDN Kompetencia Központ honlapján és szakmai blogjában olvashatóak.

2008.12.31. 7:59:29 | Permalink | Hozzászólások: 0 | Tárgyszavak: , , ,


  • IIS 7 és a Home Editionök

    Balássy György (MS RD, ASP.NET MVP, MCTS) Érdekes módon lehet IIS 7-et telepíteni a különböző Vista és Windows 7 Home Editionökre, csak éppen az eredmény nem mindig egy működő webkiszolgáló lesz. Ráadásul nagy különbségek vannak a Home Basic, Starter és Premium változatok között. Tovább »
  • CSS és Javascript minimalizálás MSBuildből

    Balássy György (MS RD, ASP.NET MVP, MCTS) Az ASP.NET Web Site típusú projekt egyik tulajdonsága, hogy nem tartozik hozzá project fájl. Ez ugyan többnyire előny, mert kényelmes, nekem most éppen hátrány, mert MSBuilddel akarom automatizálni nem csak a fordítási folyamatot, hanem a web.config production beállításokkal történő frissítését, a felesleges könyvtárak törlését, továbbá a CSS és Javascript fájlok minimalizálását is. Tovább »


Írja meg Ön is véleményét!


Hozzászólásokat csak regisztrált, bejelentkezett felhasználóktól tudunk elfogadni!

Hozzászólások