没有AJAX的ASP.NET MVC + jqGrid(ASP.NET MVC + jqGrid without AJAX)

我有一个ASP.NET MVC应用程序正在执行对产品数据库的搜索。我想使用TreeGrid模块在jqGrid中显示结果。我真的不需要网格是AJAX-y，因为数据是静态的，并且它足够小，可以立即发送到客户端。

第一个问题：如何设置jqGrid，以便不是从URL中提取JSON数据而只是查看JS变量或其他内容？

其次，什么是让ASP.NET MVC将JSON数据放入JavaScript变量的最合适的方法？我已经在我的控制器中有了List，只是想以某种方式在JSON之后把它变成JS变量。

或者我是否反对当前的太多，只是接受jqGrid似乎想要工作的AJAX-y方式？

谢谢，

〜贾斯汀

I have an ASP.NET MVC application which is executing a search against a products database. I want to display the results in a jqGrid using the TreeGrid module. I don't really need the grid to be AJAX-y because the data is static and it is small enough that it can all be sent to the client at once.

First question: how do I set up jqGrid so that instead of pulling the JSON data from a URL it just looks in a JS variable or something?

Secondly, what is the most appropriate way to get ASP.NET MVC to put JSON data into a JavaScript variable? I already have the List in my controller and just want to somehow get it out into a JS variable after JSON-ing it.

Or am I fighting against the current too much and just accept the AJAX-y way that jqGrid seems to want to work?

Thanks,

~ Justin

最满意答案

以下是如何使用JavaScript函数显示jqGrid树。

$(document).ready(function() { TreeDemo.setupGrid($("#tree")); }); TreeDemo = { data: { A: ["A1", "A2"], B: ["B1", "B2"] }, setupGrid: function(grid) { grid.jqGrid({ colNames: ['Name'], colModel: [ { name: 'Name', index: 'Name', width: "250em" } ], datatype: TreeDemo.treeData, loadui: "none", sortname: 'Number', treeGrid: true, treeGridModel: "adjacency", sortorder: "asc" }) }, treeData: function(postdata) { var items = postdata.nodeid ? TreeDemo.data[postdata.nodeid] : TreeDemo.data; var i = 0; var rows = new Array(); for (val in items) { var isLeaf = postdata.nodeid != undefined; rows[i] = { Name: val, Id: val, level: postdata.nodeid ? 1 : 0, parent: postdata.nodeid || null, isLeaf: isLeaf ? "true" : "false", expanded: "false" } i++; } $("#tree")[0].addJSONData({ Total: 1, Page: 1, Records: 2, Rows: rows }); } };

请注意，有很多选项可供选择，我的示例只有一个。

我将JSON引入JS var的方法是：

编写一个HTML Helper，它向页面发出一个简短的脚本。编写一个返回JavaScriptResult以获取文件中数据的操作，如果由于某种原因，您无法将数据内联。

您可以使用.NET JavaScript序列化程序创建JSON。查看MVC源代码中的JsonResult.ExecuteResult作为示例。

Here is how to display a jqGrid tree using a JavaScript function.

$(document).ready(function() { TreeDemo.setupGrid($("#tree")); }); TreeDemo = { data: { A: ["A1", "A2"], B: ["B1", "B2"] }, setupGrid: function(grid) { grid.jqGrid({ colNames: ['Name'], colModel: [ { name: 'Name', index: 'Name', width: "250em" } ], datatype: TreeDemo.treeData, loadui: "none", sortname: 'Number', treeGrid: true, treeGridModel: "adjacency", sortorder: "asc" }) }, treeData: function(postdata) { var items = postdata.nodeid ? TreeDemo.data[postdata.nodeid] : TreeDemo.data; var i = 0; var rows = new Array(); for (val in items) { var isLeaf = postdata.nodeid != undefined; rows[i] = { Name: val, Id: val, level: postdata.nodeid ? 1 : 0, parent: postdata.nodeid || null, isLeaf: isLeaf ? "true" : "false", expanded: "false" } i++; } $("#tree")[0].addJSONData({ Total: 1, Page: 1, Records: 2, Rows: rows }); } };

Note that there are lots of options for how you do this and my example is only one.

The way I would get the JSON into a JS var is to either:

Write a HTML Helper which emits a short script to the page. Write an action which returns a JavaScriptResult to get the data in a file, if, for some reason, you can't have the data inline.

You create the JSON using the .NET JavaScript serializer. Look at the JsonResult.ExecuteResult in the MVC source code for an example.

更多推荐