needs to implement pagination in umbraco cms v8 please suggest me - Umbraco 8

Noor Alam 26 posts 97 karma points

Aug 30, 2019 @ 04:07

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

Umbraco 8

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 1022 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 1022 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 1282 posts 2739 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...

Flag this post as spam?

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