さまざまなサプライヤーからの部品の価格と説明を含む静的な HTML テーブルがあります。
テーブルには、ユーザーが特定の部品に対して数量を入力するためのテキスト ボックスの列が含まれています。これは、サプライヤー全体の価格を計算して、最も安いものを確認できるようにするという考え方です。
合計を生成する dataTables fnFooterCallback 関数にいくつかのロジックがあるため、数量テックスボックスの値が変更されたときに、テーブルを再描画 (およびフッターの合計を更新) しようとしています。
テーブルで fnDraw() を呼び出す入力に登録された blur() ハンドラーがありますが、何もしていないようです。
ここで例を再作成しました。Javascript は次のとおりです。
var $productsTable = $("table#products").dataTable({
bFilter: false,
bPaginate: false,
bSort: false,
bInfo: false,
fnFooterCallback: function (nRow, aaData, iStart, iEnd, aiDisplay) {
// For every column after the qty and desc colums
for (var column = 2; column < aaData[0].length; column++) {
var columnTotal = 0;
// Sum every row into a column total
for (var row = 0; row < aaData.length; row++) {
var quantity = aaData[row][0].value || 0;
columnTotal += aaData[row][column] * quantity;
}
// * and / by 100 to round to 2 decimals
nRow.cells[column].innerText = Math.round(columnTotal * 100) / 100;
}
}
});
$("input[data-qty]").blur(function () {
// Example at http://datatables.net/api indicates that this should be enough?
$productsTable.fnDraw();
});
誰が私が間違っているのか教えてもらえますか?
ありがとうございました。