如何使用Ajax JQuery在Handsontable中加载数据?

问题描述:

我正在使用下面的代码从ASP.Net使用Jquery和AJAX加载数据。但是当它加载Handsontable时只加载一个带有数组数据的单元。如何使用Ajax JQuery在Handsontable中加载数据?

我尝试过不同的方式,没有运气。请帮助我从服务器加载数据。

function showGetResult() { 

      $.ajax({ 
       type: "POST", 
       url: "Input.aspx/LoadTable", 
       contentType: "application/json; charset=utf-8", 
       dataType: "json", 

       success: function (res) { 
        alert(res); 

        $("#exampleGrid").handsontable({ 
         data: res, 
         rowHeaders: false, 


         stretchH: 'all', 
         minSpareRows: 0, 
         contextMenu: true 
        }); 

       }, 
       error: function (xhr, status) { 
        alert("An error occurred: " + status); 
       } 
      }); 
     } 


<WebMethod()> <ScriptMethod()> _ 
    Public Shared Function LoadTable() As String 
     Dim dsCosts As New DataSet 
     dsCosts = DataAccess.LoadTables 
     Dim serializer As New JavaScriptSerializer() 
     Dim dt As New DataTable() 
     '.... Get datatable 
     Dim data As String = GetJson(dt) 
     Return data 
    End Function 

Private Shared Function GetJson(dt As DataTable) As String 
     Dim serializer As New JavaScriptSerializer() 
     Dim rows As New List(Of Dictionary(Of String, Object))() 
     Dim row As Dictionary(Of String, Object) = Nothing 
     Dim rowCount As Integer = 0 

     For Each dr As DataRow In dt.Rows 
      row = New Dictionary(Of String, Object)() 
      For Each col As DataColumn In dt.Columns 
       row.Add(col.ColumnName.Trim(), dr(col)) 
      Next 
      ' row.Add("RowNumber", "R||" & rowCount) 
      rows.Add(row) 
      Dim temp As String = serializer.Serialize(rows) 
      rowCount += 1 
     Next 
     Return serializer.Serialize(rows) 
    End Function 

挣扎后,我得到了答案。希望它可以帮助别人

你必须分析数据绑定它之前Handsontable

$.ajax({ 
       type: "POST", 
       url: "Test.aspx/LoadTable", 
       contentType: "application/json; charset=utf-8", 
       dataType: "json", 

       success: function (res) { 

        part = res.d; 
        var data = JSON.parse(part); 
        $('#dataTable').handsontable('loadData', data); 
       }, 
        error: function (xhr, status) { 
         alert("An error occurred: " + status); 
        } 

        }); 

       });