w2uiグリッドサマリーセルをどのように更新しますか？

Question

私は1つの列にすべての数値の合計を表示する必要があるグリッドを持っています。数字はグリッド内で編集可能で、数字が変わると（Saveの前に）合計を更新する必要があります。私は複数の問題を抱えています。機能しているプログラムを覗き込みたい場合は、関連コードを下記に、here is a jsfiddleを表示してください。

$(function() { 
    $('#grid').w2grid({ 
     name: 'grid', 
     columns: [{ 
      field: 'recid', caption: 'ID', size: '50px', sortable: true, attr: 'align=center'}, { 
      field: 'lname', caption: 'Last Name', size: '150px', sortable: true }, 
      {field: 'amount', caption: 'Amount', size: '100px', render: 'money', editable: { type: 'money' }}, 
     ], 
     records: [{ 
      recid: 1, fname: 'Jane', amount: 1000.00}, { 
      recid: 2, fname: 'Stuart', amount: 1000.00}, { 
      recid: 3, fname: 'Jin', amount: 1000.00}, { 
      recid: 's-1', fname: '', amount: 0, w2ui: {summary: true}} 
     ] 
    }); 
    w2ui.grid.on('change', function(event) { 
     event.done(function() {updateTotal(); }); 
    });  
    w2ui.grid.on('refresh', function(event) { updateTotal(); }); 
    w2ui.grid.on('render', function(event) {updateTotal(); }); 
}); 

function updateTotal() { 
    var total = 0.0; 
    for (var i = 0; i < w2ui.grid.records.length; i++) { 
     if (typeof w2ui.grid.records[i].amount == "number") { 
      total += w2ui.grid.records[i].amount; 
     } 
    } 
    w2ui.grid.get('s-1').amount = total; 
    w2ui.grid.refreshCell('s-1','amount'); 
    document.getElementById("gridtotal").innerHTML = '' + w2ui.grid.summary[0].amount + '<br>w2ui.grid.records[0].amount = ' + w2ui.grid.records[0].amount; 
} 

最初の問題 - サマリー行の更新は表示されません。 onChange、onRefresh、およびonRenderハンドラがあります。 updateTotal（）の呼び出しをラップして、すべてのレコードに 'amount'を追加し、その結果をサマリーレコードのamountフィールドに格納します。私は、量が変更された後にrefreshCellを呼び出します。グリッドが最初に表示されたときにハンドラが呼び出されないので、サマリーレコードには0が表示されます。グリッドが最初に表示されたときにサマリ量を更新するにはどのような呼び出しを行う必要がありますか？

第2の問題 - updateTotal（）は結果を間違ったセルに表示します。ボタンをクリックしてupdateTotal（）を実行します。 3000の合計は、初期状態の表に対して正しいです。サマリレコード（ 's-1'）が 'amount'フィールドで正しい値で更新され、refreshCell（ 's-1'、 'amount'）が呼び出されたinnerHTMLを更新する行から、 。しかし、グリッド上では、recid 1の 'amount'セルは3000に更新されます（右寄せではなく左寄せになります）。なぜこれが起こったのですか？要約行の '金額'セルを更新するにはどのような呼び出しを行う必要がありますか？

第3の問題 - ユーザーが '金額'セルを変更（ダブルクリックして金額を変更）すると、onChangeイベントが発生し、新しい合計が計算されます。しかし、ユーザーが行った変更はグリッドレコードでは利用できません。変更は別の場所に保存されます。したがって、新しく計算された合計は、ユーザーがグリッドに表示する数値に対応しません。更新が保存されるまで、新しい値はレコード（records [i] .amount）で使用できません。しかし、変更が保存される前にグリッドに表示されている金額にアクセスする必要があります。変更された値にアクセスするにはどうすればよいですか？

Answer 1

既存のレコードを変更するにはgetの方法を使用する必要がありますを参照してください。

w2ui.grid.set('s-1', {amount: total}); 

最初の問題について：グリッドが既にレンダリングされた後にレンダリングコールバックを割り当てています。あなたは、コンストラクタでコールバックを割り当てる必要があります：あなたが得るのではなく、setを使用する場合

$('#grid').w2grid({ 
     onRender: .... 
    }); 

あなたの第二の問題は、もはや問題ではないはずです。

第3号について：変更を保存するまで、変更はrecord.w2ui.changesに保存されますので、grid.save()に電話するか、元のレコードではなく変更の金額を取得してください。

更新フィドル：

http://jsfiddle.net/pfq20gnu/14/