Tabel Bootstrap Tambahkan Footer Tabel Untuk Jumlah Total

  • Whatsapp
Tabel Bootstrap Tambahkan Footer Tabel Untuk Jumlah Total

Untuk menambahkan baris footer ke Tabel Bootstrap oleh Wenzhixin, setel atribut data-show-footer dari tabel itu ke true.

<table id="tblInvoiceReport" data-show-footer="true">

Berikutnya adalah mengatur data-footer-formatter dari kolom Jumlah menggunakan fungsi JavaScript.

Bacaan Lainnya

<th data-field="Amount" data-searchable="true" data-class="tdDetails" data-footer-formatter="TotalFormatter">Amount</th>   

Dan inilah fungsi JavaScript untuk menghitung jumlah total.

function TotalFormatter (items) {
var totalPrice = 0;
items.forEach(function (item) {
totalPrice = parseFloat(totalPrice) + parseFloat(item.Amount.replace('$','').replace(',',''));
});

return '$' + parseFloat(totalPrice).toLocaleString(undefined, {
minimumFractionDigits: 2,
maximumFractionDigits: 2
});
};

Keluaran
Tabel Bootstrap Tambahkan Footer Tabel Untuk Jumlah Total

Pos terkait

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *