Как обработать требование подкачки в ASP.NET MVC Razor View Engine

Question

У меня есть действие контроллера, которое передает список продуктов в представление. В списке может быть ноль, один или любое количество товаров. Что я хочу, так это то, что если продуктов больше 10, то должно произойти разбиение на страницы.

Я понятия не имею, как это сделать. В настоящее время я просто передаю список для просмотра в контроллере, как показано ниже: *

    public ActionResult Catalog(string id)
    {
        Category catalog = pe.Categories.Where(cat => cat.CategoryName == id).Single();
        return View(catalog);
    }

А затем запустить foreach в представлении ::

        @foreach (var cat in Model.Products)
        {
            .
            .
        }

Я удалил код между foreach для краткости.

Скажите, пожалуйста, как обрабатывать нумерацию страниц для таких сценариев. Ранее я использовал серверные элементы управления в обычном asp.net, поэтому мне не нужно было беспокоиться о HTML и подобных вопросах. MVC и Razor довольно новы для меня, и я пытаюсь привыкнуть.

Answer 1

Вы можете взглянуть на следующую статью .Или используя MvcContrib Grid .Или даже делает это вручную .

Answer 2

Существует пакет nuget, называемый PagedList, который упрощает эту задачу.

http://nuget.org/List/Packages/PagedList

Answer 3

Если вы хотите создать пейджинг в представлении Razor, вот рабочий код для этого.

<nav aria-label="Page navigation example">
    @{
        int currentPage = ViewBag.Page;
        int staticRange = 11;
        int NoOfPage = 50;
        int Range = staticRange;
        int Start = 1;
        int End = staticRange;
        int Reminder = 0;
        int Divdent = 0;

        if (currentPage >= (Range - 1))
        {
            Reminder = currentPage % 10;
            Divdent = currentPage / 10;

            Start = (Divdent * staticRange) - Divdent;
            Range = Start + staticRange;
            End = Range;
        }
        else
        {
            Range = staticRange;
            Start = 1;
        }

        if (Range >= NoOfPage)
        {
            Range = NoOfPage;
            End = Range;

        }
        if (currentPage == NoOfPage)
        {
            Start = NoOfPage - staticRange +1;

        }
        <div>
            currentPage: @currentPage<br />
            NoOfPage:@NoOfPage <br />
            Range: @Range<br />
            Start:@Start<br />
            End:@End<br />
            Reminder:@Reminder<br />
            Divdent:@Divdent
        </div>
        <ul class="pagination">
            @{
                if (currentPage == 1)
                {
                    <li class="page-item"><a class="page-link disabled" href="javascript:void(0)">Previous</a></li>
                }
                else
                {
                    <li class="page-item"><a class="page-link" href="@Url.Action("About","Home",new {page=(currentPage>0)?currentPage-1:0 })">Previous</a></li>
                }
            }

            @{

                if (Range > staticRange)
                {

                    <li class="page-item"><a class="page-link" href="@Url.Action("About","Home",new {page=Start-1 })">...</a></li>
                }
                for (int i = Start; i < End; i++)
                {
                    <li class="page-item @(i==currentPage?"active":"")"><a class="page-link" href="@Url.Action("About","Home",new {page=i })">@i</a></li>

                    if ((i == (Range - 1)) && Range < NoOfPage)
                    {

                        <li class="page-item"><a class="page-link" href="@Url.Action("About","Home",new {page=End })">...</a></li>
                    }
                }
                <li class="page-item @(NoOfPage==currentPage?"active":"")"><a class="page-link" href="@Url.Action("About","Home",new {page=NoOfPage })">@NoOfPage</a></li>
            }

            @{
                if (currentPage < NoOfPage)
                {
                    <li class="page-item"><a class="page-link" href="@Url.Action("About","Home",new {page=currentPage+1 })">Next</a></li>
                }
                else
                {
                    <li class="page-item"><a class="page-link disabled" href="javascript:void(0)">Next</a></li>
                }
            }

        </ul>
    }
</nav>

Answer 4

Чтобы показать заголовок ---> Topaging + DisplayNameFor просто добавьте нижеприведенный код для каждого столбца в View

<th>

@Html.DisplayNameFor (model => model.First (). LastName)

Answer 5

Поскольку https://github.com/TroyGoode/PagedList больше не поддерживается, я предлагаю вам попробовать https://github.com/kpi-ua/X.PagedList, который является форком того же проекта, но главное отличие в том, что X.PagedList является переносимой сборкой.Это означает, что вы можете использовать его не только в веб-проектах, но и в проектах Winforms, Window Phone, Silverlight и т. Д. "

Чтобы установить его с помощью консоли диспетчера пакетов Nuget, выполните эту команду

PM> Install-Package X.PagedList.Mvc 

ВАЖНО: при запуске предыдущей команды будет пытаться установить JQuery 2.0 и другие зависимости, созданные Microsoft

, и выполнить действия, указанные в https://github.com/kpi-ua/X.PagedList

/ Controllers / ProductController.cs

public class ProductController : Controller
{
    public object Index(int? page)
    {
        var products = MyProductDataSource.FindAllProducts(); //returns IQueryable<Product> representing an unknown number of products. a thousand maybe?

        var pageNumber = page ?? 1; // if no page was specified in the querystring, default to the first page (1)
        var onePageOfProducts = products.ToPagedList(pageNumber, 25); // will only contain 25 products max because of the pageSize

        ViewBag.OnePageOfProducts = onePageOfProducts;
        return View();
    }
}

/ Views / Products / Index.cshtml

@{
    ViewBag.Title = "Product Listing"
}
@using PagedList.Mvc; //import this so we get our HTML Helper
@using PagedList; //import this so we can cast our list to IPagedList (only necessary because ViewBag is dynamic)

<!-- import the included stylesheet for some (very basic) default styling -->
<link href="/Content/PagedList.css" rel="stylesheet" type="text/css" />

<!-- loop through each of your products and display it however you want. we're just printing the name here -->
<h2>List of Products</h2>
<ul>
    @foreach(var product in ViewBag.OnePageOfProducts){
        <li>@product.Name</li>
    }
</ul>

<!-- output a paging control that lets the user navigation to the previous page, next page, etc -->
@Html.PagedListPager( (IPagedList)ViewBag.OnePageOfProducts, page => Url.Action("Index", new { page }) )

Другие работающие ссылки включают в себя:

http://www.asp.net/mvc/overview/getting-started/getting-started-with-ef-using-mvc/sorting-filtering-and-paging-with-the-entity-framework-in-an-asp-net-mvc-application

http://blogs.taiga.nl/martijn/2008/08/27/paging-with-aspnet-mvc/