以 Handsontable 兼容格式返回 MVC Json

Posted 2023-03-22

【中文标题】以 Handsontable 兼容格式返回 MVC Json

【英文标题】：Return MVC Json in Handsontable compatible format

【发布时间】：2016-06-25 05:36:24

【问题描述】：

我正在使用 MVC 和 Handsontable 创建类似 excel 的显示，但我无法让控制器以 Handsontable 可以使用的格式返回 json。

MVC 控制器返回一个JsonResult：

return Json(results, JsonRequestBehavior.AllowGet);

这是返回数据的js函数：

function GetCategoryAttributeList() 
    var categoryattributelist = "";
    $.ajax(
         async: true,
         type: "POST",
         url: "[myurl]/PopulateHOT",
         contentType: "application/json; charset=utf-8",
         dataType: "json",
         success: function (msg) 
             categoryattributelist = msg;
         
        return categoryattributelist;
    );

在 Firebug 中，我可以看到返回的数据：

[ StockCatalogueItemId=235031,  SKU="03121017593518",  StockCatalogueItemId=235032,  SKU="03121018032318" ...etc

我调用函数并将结果分配给一个变量：

var categoryattributelist = GetCategoryAttributeList();

然后在初始化代码中使用结果：

var hotElement = document.getElementById('#example');
    var hot = new Handsontable(hotElement, 
        data: categoryattributelist
    );

此时，数据看起来略有不同（请注意，在每个元素之前添加了“对象”）：

[Object  StockCatalogueItemId=235031,  SKU="03121017593518", Object  StockCatalogueItemId=235032,  SKU="03121018032318" ...etc

所以目前的游戏状态是一个控制台错误，我似乎无法超越这个：

TypeError: rootElement is null

有什么想法吗？

【问题讨论】：

预期的数据格式是什么？查看this tutorial，它似乎是一个或多个数组（当您返回一个对象数组时）

硬编码var categoryattributelist = [["StockCatalogueItemId", "SKU"], [235031, 235032], ["03121017593518", "03121018032318"]]; 对你有用吗？

根据this可以处理各种数据源（包括对象数据源）。

嗯，不-我得到相同的rootElement is null错误...

啊-因为hotElement是null（未定义）-getElementById('example');-没有#-（或使用hotElement = $('#example');？）

【参考方案1】：

尝试在 ajax 回调中使用初始化代码，看看是否可行

function GetCategoryAttributeList() 
    $.ajax(
         async: true,
         type: "POST",
         url: "[myurl]/PopulateHOT",
         contentType: "application/json; charset=utf-8",
         dataType: "json",
         success: function (data) 
             //handle returned data from service
             var hotElement = $('#example');
             if(hotElement)
                 var hot = new Handsontable(hotElement,  data: data );
             
         
    );