Handsontable 7.3.0を利用して一覧表画面を作成しています。CDN内のトピック「Handsontableを使ってkintoneをExcelライクに入力しよう その1」を参照して更新を試みているのですが、ColumnSortingをtrueに設定して列ソートを実現した場合、どうやらソートした状態ではセルが更新されないようです。別の行が更新されたような形跡もありません。ソートを解除すると更新できます。
行位置は上記トピックと同様にレコード番号からとってきており、ソースコードは提示されたものからほぼ変えていないのですが、ソートした状態で更新がされずエラーも発生しない原因をつかむことができません。
「ソートを禁止する」という選択肢も含め、もし設定等に心当たりがあればご教示願います。
// カスタマイズビュー設定時に登録したHTMLの要素を指定します。
var container = document.getElementById(‘sheet’);
// Handsontableをインスタンス化
var hot = new Handsontable(container, {
// kintoneのレコードデータを指定
data: records,
minSpareRows: 0,
contextMenu: false,
// カラムのヘッダーを指定
rowHeaders: true,
colHeaders: [“ID”, “社員コード”, “社員氏名”, “登録日”, “喪失日”],
dropdownMenu: true,
// dataオプションのどの列を表示するか指定する。
columns: [
{data: “レコード番号.value”, readOnly: true},
{data: “社員コード.value”},
{data: “社員氏名.value”},
{data: “登録日.value”},
{data: “喪失日.value”}
],
autoWrapRow: true,
columnSorting: {
//indicator: true,
//sortEmptyCells: true,
initialConfig: {
//column: 1,
//sortOrder: ‘asc’
}
},
autoColumnSize: {
samplingRatio: 23
},
filters: true,
manualColumnResize: true,
manualRowResize: true,
sortIndicator: true,
language: ‘ja-JP’,
licenseKey: ‘non-commercial-and-evaluation’,
//****** 以下更新のためのメソッド ******
// スプレッドシートのセルが更新されると、下記メソッドが呼び出されます。
// 呼び出されるaftarChangeメソッドは、引数changeに変更されたセルの詳細がわかり、引数sourceは何によって変更されたかがわかります。
//saveRecords, setParamsはすでに定義されている
afterChange: function(change, source) {
if (source === ‘loadData’) {
return;
}
var i;
var targets = [];
// 引数changeのデータを読み取り、kintoneへ更新APIを発行します。
for (i = 0; i < change.length; i++) {
targets.push({
id: records[change[i][0]][“レコード番号”].value,
record: setParams(records[change[i][0]])
});
}
saveRecords(targets, function(resp) {console.dir(resp); }, function(resp) {console.dir(resp); });
}
Handsontable Version7以降のライセンス形態が変更されたことは承知しております。