Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • SteveMid 25 posts 127 karma points
    Mar 03, 2022 @ 16:03
    SteveMid
    0

    Pagination when listing parent / child content

    Hi. I have been working through the official documentation tutorials and followed the below to create a Parent / Item setup:

    https://our.umbraco.com/documentation/Tutorials/Creating-Basic-Site/Articles-Parent-and-Article-Items/

    On that page, they say

    We'll assume our fictional company, Widgets Ltd, writes about ten articles a month and want the articles page to act like a blog

    That wouldn't take long before there are way too many articles for one page, but the tutorial does not go into how to add pagination, and any articles I can find online tend to be either for earlier versions (that I can't get working), or way beyond my current abilities.

    Could somebody point me in the right direction? Thanks.

  • Corné Hoskam 81 posts 588 karma points MVP 3x c-trib
    Mar 08, 2022 @ 13:08
    Corné Hoskam
    101

    Hi Steve,

    The most straight forward method for pagination would be to make use of the LINQ Skip & Take options, where Take is the amount of items you want on your page, and the Skip is the ((Pagenumber * Take) - Take).

    An example of pages with 10 items on them, where we want to fetch items for Page 3:

    var selection = Umbraco.Content(Guid.Parse("e0a4f1ff-122e-41bd-941c-f9686f03019f"))
                    .ChildrenOfType("articlesItem") 
                    .Where(x => x.IsVisible())
                    .OrderByDescending(x => x.CreateDate)
                    .Skip(20)
                    .Take(10); 
    

    Which in this case would return you the 10 items you would display on Page 3 (Items 21-30).

    Hope this helps!

    Kind regards,

    Corné Hoskam

  • SteveMid 25 posts 127 karma points
    Mar 09, 2022 @ 11:49
    SteveMid
    0

    Thanks for the reply Corné. I will look into this further.

    When building the pagination buttons, would querystrings be best?

    So... thinking this through, if we were on page 3 of 6 we'd have something like the below:

    <PREV> 1 2 |3| 4 5 6 <NEXT>
    

    with the following hyperlinks

    PREV: thispage?show=(show-1)
    1: thispage?show=1
    2: thispage?show=2
    3: thispage?show=3
    4: thispage?show=4
    5: thispage?show=5
    6: thispage?show=6
    NEXT: thispage?show=(show+1)
    

    Obviously with a little logic to build this navigation automatically and disable buttons where not needed etc.

    Or is there a better way?

  • Corné Hoskam 81 posts 588 karma points MVP 3x c-trib
    Mar 10, 2022 @ 11:58
    Corné Hoskam
    0

    Hi Steve,

    Personally I would implement it the same way as you have described, using query strings, with the addition to leave ?Show=1 blank when entering the page for the first time, where 1 would be the default page, and then have it be something like ?page=2 or ?p=2..n for any following pages!

    Kind regards,

    Corné

  • This forum is in read-only mode while we transition to the new forum.

    You can continue this topic on the new forum by tapping the "Continue discussion" link below.

Please Sign in or register to post replies