我怎样才能绑定我的视图模型为jqGrid的？ [英] How can I bind my view model to a jqGrid?

问题描述

使用MVC2和EF框架。大多数引用/博客文章，我发现迄今涉及到绑定一个表和它的数据（有时分层）与jqGrid的使用编辑功能。我不需要这个。我甚至都不需要编辑的数据 - 只是显示。我需要显示和页面的数据。排序是一个加号，搜索奖金我猜。

Using MVC2 and EF framework. Most references/blog posts I've found so far pertain to binding a single table and its data (sometimes hierarchical) to a jqGrid with editing capabilities. I don't need this. I don't even need to edit the data--just display. I need to display and page the data. Sorting is a plus, searching a bonus I guess.

jqGrid的文档显示了数据源绑定如下：

jqGrid's documentation shows the data source being bound as follows:

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

不过，我只有我的实体范围内，不会对视图模型的参考。我可以创建一个实体在这里设置？不是很熟悉。

But, I only have my Entities context without a reference to the view model. Could I create an Entity set here? Not very familiar with this.

我所有的视图模型包含几个不同的表中的数据。我能做些什么绑定到一个jqGrid的视图模型属性？我玩的jqGrid的 Trirand 的30天试用版的MVC。再次，我只需要的显示和页的数据，但我不知道如何连接视图模式，以jqGrid的数据源。

All my view models contain data from several different tables. What can I do to bind the view model properties to a jqGrid? I'm playing with Trirand's 30-day trial of jqGrid for MVC. Again, I just need to display and page the data, but I'm not sure how to hook up the view models to the jqGrid data source.

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（参数），我创建了一个匿名类型包含的菲尔哈克的参数;总共，页，记录和行。此属性JSON'ified在SearchTestGridDataRequested的最后陈述。

In testmodel and testmodel(parameters), I create an anonymous type (named datasource) containing Phil Haack's parameters; total, page, records and rows. This property is JSON'ified in the last statement of SearchTestGridDataRequested.

推荐答案

我真的不知道jqGrid的商业版，但产品内部使用开源jqGrid的，所以我可以解释它如何应共同努力ASP.NET MVC。

I don't really know the commercial version of the jqGrid, but the product use internally the Open Source jqGrid and so I could explain how it should work together with ASP.NET MVC.

在一般使用的jqGrid MVC中，你可以在页面（视图）与两个元素＆LT;表＆gt; 和＆LT; D​​IV＆GT ; 用于寻呼机。两者（＆LT;表＆gt; 和＆LT; D​​IV＆GT; ）的必须有和 ID 属性。没有其他复杂的视图结合模型是必需的。

In general to use jqGrid in MVC you can have a page (a View) with two elements <table> and a <div> used for the pager. Both (<table> and <div>) must have and id attribute. No other complex View binding to the Model is required.

现在你可以在所有JavaScript的页面加载的头放在需要的：jQuery的，jqGrid的，哪些是你想要显示它定义的jqGrid，例如列模型和不同的jqGrid参数，你页面的JavaScript具体。你需要给电网的数据绑定的最重要的参数是网​​址参数。如果你定义例如在首页控制器的动作的GetData 那么网​​址可能是首页/的GetData或'＆LT;％= Url.Content（〜/主页/的GetData）％＆GT ; 。这是够有数据绑定。模型数据的不使用是必需的。

Now you can place in the header of the page loading of all JavaScripts needed: jQuery, jqGrid and you page specific JavaScript which define jqGrid which you want to display, for example column model and different jqGrid parameters. The most important parameter which you need to bind the grid to the data are url parameter. If you define for example in the Home controller the action GetData then the url could be "Home/GetData" or '<%= Url.Content("~/Home/GetData")%>'. This is enough of have "data binding". No usage of Model data is required.

行动的GetData 可以定义为如下：

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

如果您希望只支持数据排序和分页，但不需要任何搜索（过滤）的支持。

if you want support only data sorting and paging but don't need any searching (filtering) support.

在搜索支持的情况下，你需要添加额外的参数。如果你想使用高级搜索或的工具栏搜索与 stringResult：真正的参数，你应该添加一个额外的参数字符串过滤器：

In case of the searching support you need to add an additional parameters. If you want to use Advanced Searching or Toolbar Searching with stringResult:true parameter you should add one additional parameter string filter:

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

在实施单场网格搜索的情况下，它应该是

In case of implementing Single Field Searching in your grid it should be

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

您也可以使一个通用的动作：

You can also make an universal action:

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

因此​​，在所有情况下，你需要做的差不多了，但你会在一个小的其它形式得到额外的参数。

So in all cases you have to do almost the same, but you will receive additional parameters in a little other form.

现在，你应该决定以何种形式要从控制器动作提供jqGrid的数据。 jqGrid的非常灵活，你可以回去了标准格式数据

Now you should decide in which form you want provide the data for jqGrid from the controller action. jqGrid is very flexible and you can either get back data in the standard format

{ 
  "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 其描述数据应该如何读取（参见<一个href=\"http://www.trirand.com/jqgridwiki/doku.php?id=wiki%3aretrieving_data#json_data\">documentation).

or in another (more readable, but more long) format. In the last case you will have to define a small parameter jsonReader which describe how the data should be read (see documentation).

如果你看一些老的回答像<一个内部href=\"http://stackoverflow.com/questions/4078592/sortable-jqgrid-using-linq-to-mysql-dblinq-and-dynamic-linq-orderby-doesnt-w/4079121#4079121\">this, 这个，<一个href=\"http://stackoverflow.com/questions/3169408/jqgrid-setgridparam-datatypelocal/3170652#3170652\">this或<一个href=\"http://stackoverflow.com/questions/2835957/jquery-with-asp-net-mvc-calling-ajax-enabled-web-service/2836817#2836817\">this你会发现完整的工作MVC项目的足够code片段，你可以为你的建议修改。 <一href=\"http://stackoverflow.com/questions/4078592/sortable-jqgrid-using-linq-to-mysql-dblinq-and-dynamic-linq-orderby-doesnt-w/4079121#4079121\">The从列表中第一个参考应该有希望赋予你的答案主要问题如何从EF来源或任何其他prepare数据的IQueryable＆LT; T＆GT; 源中的数据这jqGrid的需要。

If you look inside of some old answers like this, this, this or this you will find enough code fragments of full working MVC projects which you can modify for your propose. The first reference from the list should gives hopefully the answer on you main question how to prepare data from EF source or any other IQueryable<T> source the data which jqGrid need.

在我的另一个<一个href=\"http://stackoverflow.com/questions/3318277/guidance-on-a-better-way-to-retain-filtering-options-when-using-asp-net-mvc-2/3371155#3371155\">old回答，我描述的一般模式是如何的jqGrid在MVC环境下使用更详细的，但对于谁已经测试了不同的实现方式的人。

In another my old answer where I describe the general schema how jqGrid can be used in MVC environment more detailed, but for people who tested already different implementation ways.

这篇关于我怎样才能绑定我的视图模型为jqGrid的？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！