asp.net-mvc - 如何将我的 View 模型绑定(bind)到 jqGrid？

Question

使用 MVC2 和 EF 框架。到目前为止，我发现的大多数引用资料/博客文章都涉及将单个表及其数据(有时是分层的)绑定(bind)到具有编辑功能的 jqGrid。我不需要这个。我什至不需要编辑数据——只需显示即可。我需要显示和分页数据。排序是一个加号，我猜搜索是一个奖励。

jqGrid 的文档显示绑定(bind)的数据源如下:

return gridModel.OrdersGrid.DataBind(northWindModel.Orders);

但是，我只有我的实体上下文，没有对 View 模型的引用。我可以在这里创建一个实体集吗？对这个不是很熟悉。

我所有的 View 模型都包含来自几个不同表的数据。如何将 View 模型属性绑定(bind)到 jqGrid？我在玩Trirand的 jqGrid for MVC 的 30 天试用版。同样，我只需要显示和分页数据，但我不确定如何将 View 模型连接到 jqGrid 数据源。

编辑

public ActionResult test()
    {
        var gridModel = new testmodel();
        var viewModel = gridModel.testgrid;
        SetupTestGrid(viewModel);
        return View(gridModel);
    }

    private void SetupTestGrid(JQGrid viewModel)
    {
        viewModel.ID = "TestGrid";
        viewModel.DataUrl = Url.Action("SearchTestGridDataRequested");
        viewModel.ToolBarSettings.ShowEditButton = false;
        viewModel.ToolBarSettings.ShowAddButton = false;
        viewModel.ToolBarSettings.ShowDeleteButton = false;
    }

    public JsonResult SearchTestGridDataRequested(string sidx, string sord, int page, int rows)
    {
        var gridModel = new testmodel(sidx, sord, page, rows);
        SetupTestGrid(gridModel.testgrid);
        return Json(gridModel.datasource);
    }

在 testmodel 和 testmodel(parameters) 中，我创建了一个匿名类型(命名数据源)，其中包含 Phil Haack's参数;总计、页、记录和行。此属性在 SearchTestGridDataRequested 的最后一条语句中被 JSON 化。

Answer 1

我真的不知道 jqGrid 的商业版本，但该产品在内部使用开源 jqGrid，所以我可以解释它应该如何与 ASP.NET MVC 一起使用。

一般来说，要在 MVC 中使用 jqGrid，您可以拥有一个包含两个元素的页面(一个 View )<table>和 <div>用于寻呼机。两者(<table> 和 <div>)必须有和id属性。不需要其他复杂的 View 绑定(bind)到模型。

现在，您可以在页面加载所需的所有 JavaScript 的标题中放置:jQuery、jqGrid 和页面特定的 JavaScript，这些 JavaScript 定义了要显示的 jqGrid，例如列模型和不同的 jqGrid 参数。将网格绑定(bind)到数据所需的最重要参数是 url范围。例如，如果您在 Home 中定义 Controller Action GetData然后 url可能是 "Home/GetData"或 '<%= Url.Content("~/Home/GetData")%>' .有了“数据绑定(bind)”就足够了。不需要使用模型数据。

行动GetData可以定义如下:

JsonResult GetData(string sidx, string sord, int page, int rows)

如果您只想支持数据排序和分页但不需要任何搜索(过滤)支持。

在搜索支持的情况下，您需要添加额外的参数。如果你想使用 Advanced Searching或 Toolbar Searching与 stringResult:true参数你应该添加一个额外的参数string filter :

JsonResult GetData (string sidx, string sord, int page, int rows, string filter)

在执行Single Field Searching的情况下在你的网格中应该是

JsonResult GetData (string sidx, string sord, int page, int rows,
                    string searchField, string searchString, string searchOper)

您还可以进行通用操作:

JsonResult GetData (string sidx, string sord, int page, int rows, string _search
                    string searchField, string searchString, string searchOper,
                    string filter)

因此，在所有情况下，您都必须执行几乎相同的操作，但您会收到其他形式的附加参数。

现在您应该决定要以哪种形式从 Controller 操作中为 jqGrid 提供数据。 jqGrid 非常灵活，您可以获取标准格式的数据

{ 
  "total": "xxx",   // the total number of pages
  "page": "yyy",    // the current page number of the data returned
  "records": "zzz", // the total number of records
  "rows" : [
    {"id" :"1", "cell" :["cell11", "cell12", ...,  "cell1n"]},
    {"id" :"2", "cell":["cell21", "cell22", ..., "cell2n"]},
      ...
  ]
}

或以另一种(更易读，但更长)格式。在最后一种情况下，您必须定义一个小参数 jsonReader它描述了应该如何读取数据(参见 documentation)。

如果您查看一些旧答案，例如 this , this , this或 this您将找到足够多的完整工作 MVC 项目的代码片段，您可以根据自己的提议对其进行修改。 The first reference从列表中应该给出希望 您的主要问题的答案如何从 EF 源或任何其他 IQueryable<T> 准备数据获取 jqGrid 需要的数据。

在另一个我的old answer我在这里更详细地描述了如何在 MVC 环境中使用 jqGrid 的一般模式，但是对于已经测试过不同实现方式的人来说。