MVC4 WebGrid 和 Ajax 分页

Question

我有一个关于 MVC4 中的 WebGrid 的简单问题（可能不是一个简单的答案！）。

我有一个像这样的功能性网格

<div id="Submitted">
    @Html.Grid(
        Model.Submitted, displayHeader: false, fieldNamePrefix: "Submitted_", ajaxUpdateContainerId: "Submitted",
        columns: new WebGridColumn[]{
        new WebGridColumn(){ ColumnName = "Date",Header = "Date",Style = "",CanSort = false,Format = x => x.Date.ToString(Globals.Default.DATEFORMAT) },
        new WebGridColumn(){ ColumnName = "ID",Header = "Review",Style = "", CanSort = false, Format = x=>@Html.ActionLink("Review","Review","Company",new{ID = x.ID },new{})  }
    })
</div>

当单击下一页按钮时使用 Ajax 重新加载“已提交”div 时，它会生成下一页正常 - 但它会转到控制器上的原始操作，这应该是一个完整的页面。

它如何过滤除网格本身之外的所有内容？用一些聪明的 C# 代码或 jQuery？

编辑： 澄清一下，我不是在问如何更好地进行分页，或者我自己，就我而言，使用 webgrid 的默认分页正在正常工作 - 我在问 WebGrid 是如何进行 ajax 分页时的回发到返回完整页面的操作。

Answer 1

它使用 jquery load() 和允许它只选择相关传入节点的功能来执行此操作。这取自http://msdn.microsoft.com/en-us/magazine/hh288075.aspx

为了让脚本仅应用于 WebGrid，它使用 jQuery 选择器来识别具有 ajaxGrid 类集的元素。该脚本使用 jQuery live 方法 (api.jquery.com/live) 为排序和分页链接（通过网格容器内的表页眉或页脚标识）建立单击处理程序。这将为匹配选择器的现有和未来元素设置事件处理程序，这很方便，因为脚本将替换内容。

Answer 2

您应该将网格放在局部视图中并通过 Ajax 对其进行更新。在控制器中，您应该找到请求的类型。如果是ajax请求（通过 Request.IsAjaxRequest() ）你必须返回部分视图，否则你必须返回原始视图。

如果您使用 ajax.beginform，您必须执行以下操作：

@using (Ajax.BeginForm("Index", new AjaxOptions { OnFailure = "searchFailed", HttpMethod = "POST", UpdateTargetId = "Submitted" }))
    {
    ...
    }

<div id="Submitted">
   @Html.Partial("_partialviewname", Model)    
</div>

rn 在控制器中：

  public ActionResult Index(int? page)
    {
      ...
      if (Request.IsAjaxRequest())
        {
          return PartialView("_partialviewname", db.model)  
         }
      return View(db.model)

    }