Question

Hi I'm currently working on a project that needs paging numbers to navigate through products. I am currently using ReflectionIT.Paging.MVC.

My problem is that the paging buttons are showing however, when clicked it doesn't change pages. I've followed pretty much all tutorials and none of them has gotten the paging buttons to work.

Controller Index Code:

using System;
using System.Collections.Generic;

using System.Linq;
using System.Threading.Tasks;

using Microsoft.AspNetCore.Mvc.Rendering;
using Microsoft.EntityFrameworkCore;
using MVCManukauTech.Models.DB;
using MVCManukauTech.ViewModels;
using ReflectionIT.Mvc.Paging;
using Pagination;

using Microsoft.AspNetCore.Mvc;
using Microsoft.EntityFrameworkCore.Metadata.Internal;

namespace MVCManukauTech.Controllers
{
public class CatalogController : Controller
{
    private readonly F191_Grace_ProjectContext _context;

    public CatalogController(F191_Grace_ProjectContext context)
    {
        _context = context;
    }




    public async Task<IActionResult> Index(int page = 1 ) 
    {
        //140903 JPC add CategoryName to SELECT list of fields
        string SQL = "SELECT ProductId, Product.CategoryId AS CategoryId, Name, ImageFileName, UnitCost"
            + ", SUBSTRING(Description, 1, 100) + '...' AS Description, CategoryName "
            + "FROM Product INNER JOIN Category ON Product.CategoryId = Category.CategoryId ";
        string categoryName = Request.Query["CategoryName"];

        if (categoryName != null)
        {
            //140903 JPC security check - if ProductId is dodgy then return bad request and log the fact 
            //  of a possible hacker attack.  Excessive length or containing possible control characters
            //  are cause for concern!  TODO move this into a separate reusable code method with more sophistication.
            if (categoryName.Length > 20 || categoryName.IndexOf("'") > -1 || categoryName.IndexOf("#") > -1)
            {
                //TODO Code to log this event and send alert email to admin
                return BadRequest(); // Http status code 400
            }

            //140903 JPC  Passed the above test so extend SQL
            //150807 JPC Security improvement @p0
            SQL += " WHERE CategoryName = @p0";
            //SQL += " WHERE CategoryName = '{0}'";
            //SQL = String.Format(SQL, CategoryName);
            //Send extra info to the view that this is the selected CategoryName
            ViewBag.CategoryName = categoryName;
        }


        //150807 JPC Security improvement implementation of @p0
        var products = _context.CatalogViewModel.FromSql(SQL, categoryName).AsNoTracking().OrderBy(s=>s.Name);

        var model = await PagingList.CreateAsync(products, 6, page);

        return View(model);

View Index Code:

  @model ReflectionIT.Mvc.Paging.PagingList <MVCManukauTech.ViewModels.CatalogViewModel>

@using ReflectionIT.Mvc.Paging
@addTagHelper*,ReflectionIT.Mvc.Paging
@{

//Are we showing all the products or only one category?
if (ViewBag.CategoryName == null)
{
    ViewBag.Title = "Catalog";
}
else
{
    ViewBag.Title = "Catalog - " + ViewBag.CategoryName;
}
}
<link href="~/css/StyleSheet.css" rel="stylesheet" />

<div class="bg">

    <h2>@ViewBag.Title</h2>

<nav aria-label="Product Paging">
    @await this.Component.InvokeAsync("Pager", new { pagingList = this.Model });
</nav>


<div class="text-center">
    <a href="~/Catalog"><button type="button" class="btn  btn-lg">All</button></a>
    <a href="~/Catalog?CategoryName=Transports"><button type="button" class="btn btn-lg">Transports</button></a>
    <a href="~/Catalog?CategoryName=Gadgets"><button type="button" class="btn  btn-lg">Gadgets</button></a>
    <a href="~/Catalog?CategoryName=Furnitures"><button type="button" class="btn  btn-lg">Furnitures</button></a>
    <a href="~/Catalog?CategoryName=Kitchen"><button type="button" class="btn  btn-lg">Kitchen</button></a>
    <a href="~/Catalog?CategoryName=Entertainment"><button type="button" class="btn  btn-lg">Entertainment</button></a>
    <a href="~/Catalog?CategoryName=Bathroom"><button type="button" class="btn  btn-lg">Bathroom</button></a>
    <a href="~/Catalog?CategoryName=Technology"><button type="button" class="btn  btn-lg"> Technology</button></a>
</div>


<table class="table" style="background-color:snow">
    <tr>

        <th>
            Name
        </th>

        <th>
            Image
        </th>
        <th>
            Unit Cost
        </th>
        <th>
            Description
        </th>
        <th>
            Category
        </th>
        <th></th>
    </tr>

    @foreach (var item in Model)
    {
        <tr class="d-block">

            <td>
                @item.Name
            </td>
            <td>
                <img src="~/Images/Product_Images/@item.ImageFileName" style="width:100px" />
            </td>
            <td style="text-align: right">
                @item.UnitCost
            </td>
            <td>
                @item.Description
            </td>
            <td>
                @item.CategoryName
            </td>
            <td>
                <a href="~/OrderDetails/ShoppingCart?ProductId=@item.ProductId"><button>Add&nbsp;to&nbsp;Cart</button></a>
            </td>
            <td>
                <a href="~/Catalog/Details?ProductId=@item.ProductId"><button>Details</button></a>
            </td>
        </tr>
        <tr></tr>
    }


</table>

<nav aria-label="Product Paging">
    <vc:pager paging-list=@Model />;
</nav>

Answer 1

对于此问题，其原因是page是保留的路由名称。

我已提交拉取请求，并选中change page to pageindex #24。

在作者将其合并之前，您可以获取此pull请求并在您的项目中引用它。

请注意，在

之类的索引操作中将page更改为pageIndex

public async Task<IActionResult> Index(int pageIndex = 1)
{
    var qry = _context.Products.AsNoTracking().OrderBy(u => u.Id);
    var model = await PagingList.CreateAsync(qry, 6, pageIndex);
    return View(model);
}

How to get paging buttons to function

1 个答案: