3

さまざまなサプライヤーからの部品の価格と説明を含む静的な 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();
});​

誰が私が間違っているのか教えてもらえますか?

ありがとうございました。

4

1 に答える 1

3

問題は、コードでaaData[row][0].value何も返さないことです。配列を保持して、そこから合計値を設定することができます。イベントではblur、各テキスト ボックスに適切な値を設定する必要があります。ここに変更されたコードへのリンクがあります。

于 2012-12-06T18:36:54.687 に答える