沒有AJAX的ASP.NET MVC + jqGrid

Question

我有一個ASP.NET MVC應用程序，該應用程序正在對產品數據庫執行搜索。 我想使用TreeGrid模塊在jqGrid中顯示結果。 我真的不需要網格為AJAX-y，因為數據是靜態的，並且數據足夠小，可以一次全部發送到客戶端。

第一個問題：如何設置jqGrid，以使其不再從URL中提取JSON數據，而是僅查找JS變量或類似內容？

其次，使ASP.NET MVC將JSON數據放入JavaScript變量的最合適方法是什么？ 我已經在控制器中擁有List，並且只想以某種方式將其JSON化后將其放入JS變量中。

還是我與當前的斗爭太多了，只是接受jqGrid似乎想要工作的AJAX-y方法？

謝謝，

〜賈斯汀

Answer 1

這是使用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的方法是：

1. 編寫一個HTML Helper，它向頁面發出簡短的腳本。
2. 如果由於某種原因無法內聯數據，則編寫一個返回JavaScriptResult以獲取文件中的數據。

您可以使用.NET JavaScript序列化器創建JSON。 查看MVC源代碼中的JsonResult.ExecuteResult作為示例。

Answer 2

請參閱jqGrid文檔Wiki中的“ 數據處理”頁面。 在那里，您將找到許多將數據饋送到網格的方法。

Answer 3

還有一個Table_to_jqGrid插件可能是一個有用的選項。