将handsontable中所做的更改绑定到handsontable同一行中的另一个值答案

【问题标题】：Tying changes made in handsontable to another value in the same row in handsontable将handsontable中所做的更改绑定到handsontable同一行中的另一个值
【发布时间】：2015-11-07 18:57:20
【问题描述】：

我正在使用 handsontable 来帮助通过网络浏览器对大表进行更改。问题是更改需要与唯一 ID 相关联，例如 RDBMS 中的主 ID。对于问题/示例/代码中的数据，custId 与主键或唯一标识符一样好。

如何将更改：数组中的值更改：与 custId..？

看起来我正在尝试在 hot5 上调用一个函数，即使在渲染 hot5 时也是如此。 [看起来不太可能，并且可能是根本原因]这就是为什么 getchangedPin2 返回 null，这将我带到第二部分 pf 问题是否有不同的方法来实现这一点..？

$(document).ready(function () {
  container = document.getElementById('example');
  hot5 = new Handsontable(container, {
    data: request,
	dataSchema: {custID: null, areaCode: null, pinNo: null, importantStatus: null, subAreaCode: null},
    colHeaders:  ['custID', 'areaCode', 'pinNo', 'importantStatus', 'subAreaCode'],
    columns: [

      { data: 'custID'},
      { data: 'areaCode'},
      { data: 'pinNo'},
      { data: 'importantStatus'},
      { data: 'subAreaCode'}
	  
	    ],

  afterChange: function (changes, source) {
	    if (source=== 'loadData') {
	        return;
	    }
	    showValInConsole(changes);
	    console.log("the changes "+ getchangedpinNo2(changes[0],'custID'));
	  },
    columnSorting: true,
    minSpareRows: 1
  });
  
    var showValInConsole = function(changes){
	    var rowIndex = changes[0];
	    var col = changes[1];
	    var oldCellValue = changes[2];
	    var newCellValue = changes[3];
	    var row_ref = getchangedPin2(changes[0],'custID');

	   	    
	    console.log(rowIndex + " " + col + " "+ oldCellValue + " "+ newCellValue + " " +getchangedPin2(rowIndex,'custID') );
  };
  
  var getchangedPin2 = function(row, col){
	  var urnChanged2 = hot5.getDataAtRowProp(row, col);
	  return urnChanged2;
  }; 
  
  });

<link href="http://handsontable.com//bower_components/handsontable/dist/handsontable.full.min.css" rel="stylesheet"/>
<script src="http://handsontable.com//bower_components/handsontable/dist/handsontable.full.min.js"></script>
<!DOCTYPE html>
<html>
<head>
<title>Test1</title>
<meta charset="ISO-8859-1">
    
    <script src="js/handsontable.full.js"></script>
    <script type="text/javascript" src="js/test.js"></script>
    <script src="js/jquery-1.11.3.min.js"></script>
    <link rel="stylesheet" media="screen" href="css/handsontable.full.css">
</head>
<body>
 <div id="hoTable"></div>
<input id="SubmitButton" type="button" value="Submit" />

</body>
</html>

注意：无法添加 handsontable.full.min.css 和 handsontable.full.js

【问题讨论】：

你能再清楚一点吗？不知道你在问什么。此外，changes 是一个更改数组，因此要获得 changes[0][0] 的行，仅供参考
您好，我已经编辑了 sn-p 的 js 部分，在“minSpareRows: 1”语句上方添加了“columnSorting: true”。我也承认changes是一个change数组的array，每个change数组都包含行索引、列名、旧值和新值。现在在js代码中进行上述更改，即columnSorting：true，用户将能够对列进行排序[这是一个要求]但是现在，在用户对列进行排序后，更改数组将给出一个行索引值将不匹配预先排序的表格。
我正在尝试关联对特定 custID 所做的更改，匹配/链接/关联到相同的 custID，即使在对列进行排序后也是如此，这是我一直试图通过使用函数 getchangedPin2，我似乎无法让它工作。

标签： javascript jquery handsontable

【解决方案1】：

This SO question 有一个答案可以解释您的情况。总之，您可以阅读此处的文档以了解 Handsontable 使用的排序插件。它利用了他们所谓的logicalIndex，因为data 数组永远不会发生变异；相反，他们保留了第二个数据结构，其中引用了physicalIndex-es。

归结为以下代码行：

physicalIndex = instance.sortIndex[logicalIndex][0];

您的instance 应该是Handson 实例，logicalIndex 应该是您的changes[0][0]。

【讨论】：