needs to implement pagination in umbraco cms v8 please suggest me

Noor Alam 26 posts 97 karma points

Aug 30, 2019 @ 04:07

Needs to implement pagination in umbraco cms v8 .. Please suggest me.

Copy Link

Shaishav Karnani from digitallymedia.com 354 posts 1638 karma points

Aug 30, 2019 @ 04:47

Hi Noor,

Please can you review the logic on this article related to pagination. This also applies to Umbraco 8 although some syntax could slightly change.

https://stackoverflow.com/questions/24906410/umbraco-pagination

Please review and share your views.

Regards, Shaishav

Copy Link

Noor Alam 26 posts 97 karma points

Aug 30, 2019 @ 04:49

Sure Shaishav ... I am just trying to implement and let you know Thanks

Copy Link

Noor Alam 26 posts 97 karma points

Aug 30, 2019 @ 06:46

@inherits Umbraco.Web.Mvc.UmbracoViewPage

<section id="one">

    @{
        var pageSize = 8;
        if (Model.Content.HasValue("numberOfItemsPerPage"))
        {
            pageSize = Model.Content.GetPropertyValue<int>("numberOfItemsPerPage");
        }

        var page = 1; int.TryParse(Request.QueryString["page"], out page);
        var items = Umbraco.TypedContent(Model.Content.Id).Children.Where(x => x.DocumentTypeAlias == "exampleAlias" && x.IsVisible());
        var totalPages = (int)Math.Ceiling((double)items.Count() / (double)pageSize);

        if (page > totalPages)
        {
            page = totalPages;
        }
        else if (page < 1)
        {
            page = 1;
        }

        foreach (var item in items.Skip((page - 1) * pageSize).Take(pageSize).OrderBy("createDate descending"))
        {

            <div class="example-div">
                        <h3><a href="@item.GetPropertyValue("Url")">@item.GetPropertyValue("Name")</a></h3>
            </div>
        }

        if (totalPages > 1)
        {
            <div class="pagination">
                <ul>
                    @if (page > 1)
                    {
                        <li><a href="?page=@(page-1)">Prev</a></li>
                    }
                    @for (int p = 1; p < totalPages + 1; p++)
                    {
                        <li class="@(p == page ? "active" : string.Empty)">
                            <a href="?page=@p">@p</a>
                        </li>
                    }
                    @if (page < totalPages)
                    {
                        <li><a href="?page=@(page+1)">Next</a></li>
                    }
                </ul>
            </div>
        }
    }
</section>

After using shared code getting attached error. Please suggest. enter image description here

Copy Link

Noor Alam 26 posts 97 karma points

Aug 30, 2019 @ 07:03

Since i am inherits **

Umbraco.Web.Mvc.UmbracoViewPage ContentModels.News

** and using ContentModels = Umbraco.Web.PublishedModels

Please suggest. As i have added multiple news with parent and child pages with news and news details. and in user interface i am trying to show in using partial view.

see screen shot.

enter image description here

Copy Link

Shaishav Karnani from digitallymedia.com 354 posts 1638 karma points

Aug 30, 2019 @ 07:14

Hi Noor,

Please can you check if you need Model.Content.HasValue or Model.HasValue. I think you need later.

Regards,

Shaishav

Copy Link

Noor Alam 26 posts 97 karma points

Aug 30, 2019 @ 10:04

Now i am getting below error enter image description here

Copy Link

Steve Megson 151 posts 1024 karma points MVP c-trib

Aug 30, 2019 @ 13:52

.GetPropertyValue<T>(alias) has been replaced by .Value<T>(alias) in version 8.

Copy Link

Shaishav Karnani from digitallymedia.com 354 posts 1638 karma points

Aug 30, 2019 @ 13:27

You can add following namespaces to your web.config of views folder. This will allow you to get access to above methods.

        <add namespace="Umbraco.Web" />
        <add namespace="Umbraco.Core" />
        <add namespace="Umbraco.Core.Models" />
        <add namespace="Umbraco.Web.Mvc" />
        <add namespace="umbraco" />
        <add namespace="Examine" />
        <add namespace="Umbraco.Web.PublishedContentModels" />

Cheers,

Shaishav

Copy Link

Noor Alam 26 posts 97 karma points

Aug 30, 2019 @ 19:26

As per your suggestion i have changed the code and i am not getting error. But when i am running page not getting output even pagination :( Please check following code

@inherits Umbraco.Web.Mvc.UmbracoViewPage

@{ Layout = "webbaseTempate.cshtml"; }

@{
    var pageSize = 2;
    if (Model.HasValue("numberOfItemsPerPage"))
    {
        pageSize = Model.Value<int>("numberOfItemsPerPage");
    }

    var page = 1; int.TryParse(Request.QueryString["page"], out page);
    var items = Umbraco.Content(Model.Id).Children.Where(x => x.ContentType.Alias == "exampleAlias" && x.IsVisible());
    var totalPages = (int)Math.Ceiling((double)items.Count() / (double)pageSize);

    if (page > totalPages)
    {
        page = totalPages;
    }
    else if (page < 1)
    {
        page = 1;
    }

    foreach (var item in items.Skip((page - 1) * pageSize).Take(pageSize).OrderBy(x => x.CreateDate).ToList())
    {

        <div class="example-div">
            <h3><a href="@item.Value("Url")">@item.Value("Name")</a></h3>
        </div>
    }

    if (totalPages > 1)
    {
        <div class="pagination">
            <ul>
                @if (page > 1)
                {
                    <li><a href="?page=@(page-1)">Prev</a></li>
                }
                @for (int p = 1; p < totalPages + 1; p++)
                {
                    <li class="@(p == page ? "active" : string.Empty)">
                        <a href="?page=@p">@p</a>
                    </li>
                }
                @if (page < totalPages)
                {
                    <li><a href="?page=@(page+1)">Next</a></li>
                }
            </ul>
        </div>
    }
}

Please suggest. Very exciting to see the pagination

Copy Link

Steve Megson 151 posts 1024 karma points MVP c-trib

Aug 30, 2019 @ 19:48

I assume that your site doesn't have a document type called exampleAlias, so this line doesn't match any items:

 var items = Umbraco.Content(Model.Id).Children.Where(x => x.ContentType.Alias == "exampleAlias" && x.IsVisible());

If you want a paged list of all children of any document type, this should do the job:

 var items = Umbraco.Content(Model.Id).Children;

Copy Link

Noor Alam 26 posts 97 karma points

Aug 30, 2019 @ 20:06

Thanks Steve............ Its working now. :)

Copy Link

Amir Khan 1289 posts 2746 karma points

Aug 30, 2019 @ 20:24

Small thing, you might want to keep .Where(x => x.IsVisible()); or .Where("Visible") to skip nodes where umbracoNaviHide is checked.

Copy Link

is working on a reply...

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.

Flag this post as spam?

Needs to implement pagination in umbraco cms v8 .. Please suggest me.