handsontable - 刷新数据并维护过滤和排序条件答案

【问题标题】：handsontable - Refresh data and maintain filter and sort conditionshandsontable - 刷新数据并维护过滤和排序条件
【发布时间】：2017-11-03 07:33:24
【问题描述】：

我使用handsontable 作为位于网络服务器上的MySQL 数据库的前端。用户对前端handsontable上的数据进行过滤、排序、修改等。

由于各种原因，后端 MySQL 数据库发生变化。我需要将此信息同步回用户前端。

我可以使用 HTTP 请求轻松地做到这一点，从数据库中重新下载数据，并使用以下代码 sn-p 将此数据写入 handsontable。

$http({
    method: "POST",
    url: "my-data-url",
    data: "my-post-data"
  }).then(function(response){
    // response contains the handsontable data
    var json_response = response.data;
    // Update the data in my table instance
    hot.updateSettings({
        data: json_response
    })
    // hot looses its sort and filter conditions...
    // how can I maintain these or re-apply them??
  });

问题是这段代码清除了所有用户当前的排序和过滤条件。当可动手做的数据对象更新时，我想在哪里保留这些。有谁知道我如何做到这一点？

【问题讨论】：

标签： javascript angular handsontable

【解决方案1】：

我设法解决了这个问题。各个方面的解决方案如下：

过滤器

将 Handsontable 的版本更新到 v1.11.0 版本在更新数据设置时自行维护过滤器。

排序

将上述方法更新如下：

$http({
  method: "POST",
  url: "my-data-url",
  data: "my-post-data"
}).then(function(response){
  // response contains the handsontable data
  var json_response = response.data;

  // Get sort data of handsontable prior to updating the data setting
  if (isSorted(hot) == true) {
      var sortData = getSortData(hot)
  } 

  // Update the data in my table instance
  hot.updateSettings({
      data: json_response
  })

  // Re-apply previous sorts
  if (sortData) {
      hot.sort(sortData.sortColumn, sortData.sortOrder);
  }

  });

// Determines if sorts have been applied
var isSorted = function (hot_instance) {
    return hot_instance.sortingEnabled && typeof hot_instance.sortColumn != 'undefined' && typeof hot_instance.sortOrder != 'undefined';
}

// gets the sort data for a handsontable passed
var getSortData = function (hot_instance) {
  var sortData = [];
  // Get sorted column number
  var columnNo = hot_instance.sortColumn;
  // Get current sort order of column
  // false = desceding order
  var sortOrder = hot_instance.sortOrder;
  sortData.sortColumn = columnNo;
  sortData.sortOrder = sortOrder;
  return sortData;
}

希望对遇到类似问题的人有所帮助。

【讨论】：