如何在 asp.net viewmodels 中使用 jquery 分页答案

【问题标题】：how to use jquery pagination with asp.net viewmodels如何在 asp.net viewmodels 中使用 jquery 分页
【发布时间】：2019-07-18 21:23:31
【问题描述】：

我想知道在 asp.net 中使用 viewModel 时如何实现分页。使用 Jquery 以不加载所有表数据。这是我的项目。

我有 2 张桌子：

产品包含：ProductID - ProductName - ProductDescription。

图像包含：ImageID - ImagePath - ProductFK

在我的视图模型中

public class myViewModel
{
  public List<Products> myProducts { get; set; }
  public List<Images> myImages{ get; set; }
}

在我的索引视图中

@model myProject.myViewModel
@foreach (Products item in Model.myProducts)
{
@item.ProductName
@item.ProductDescription
}

这是我的控制器，它返回产品和图像列表。

 public ActionResult Show()
{
var viewModel = new myViewModel{
myProduct= DB.Products.ToList(),
myImages= DB.Images.ToList()};
return View(viewModel);
}

【问题讨论】：

使用Skip 和Take: DB.Products.Skip(pageIndex * pageSize).Take(pageSize).ToList()。其中pageIndex 和pageSize 将由用户从视图中提供。
@Bardr 感谢回复，这听起来不错，但我想在没有任何用户迭代的情况下进行分页，所以一旦列表加载，我想要一个分页索引，用户可以在其中导航项目加载列表
@riario 在没有任何用户迭代的情况下进行分页是什么意思？
@riario 然后自己提供 pageSize 的默认值。

标签： c# jquery asp.net-mvc pagination

【解决方案1】：

在您的控制器或共享设置类中创建一个变量以确定页面大小，如果您以后想更改，您将在一个地方更改（或者您可以根据系统设置动态读取它）。

public int pageSize
{
    get
    {
        return 10;
    }
}

在您的视图模型中，添加名为 pageNumber 的新 int 字段。您将设置此变量以告诉您的控制器要获取哪个页面。

然后使用实体框架 LINQ 从数据库中仅获取所需的数据：

     public ActionResult Show()
    {
    var viewModel = new myViewModel{
    myProduct= DB.Products..ToList(),

    myImages= DB.Images.OrderBy(a => a.Id).Skip(pageSize * (pageNumber- 1))
         .Take(pageSize).ToList(); // this will fetch only required data from database
}
    return View(viewModel);
    }

在您的 UI 中，您需要将页码传递给控制器，您的操作将变为：

 public ActionResult Show(int pageNumber)
{
  var viewModel = new myViewModel();
viewmodel.PageNumber = pageNumber; // pass it to view again you may need to give the selected page special css
}

【讨论】：