數據表導出到 Excel 並將數字列格式化為貨幣

Question

我正在嘗試將數字數據導出到 Excel。 數字格式如下：

• 千位分組分隔符：“.”
• 小數點指示符：“,”
• 要顯示的小數點數：“0”
• 前綴：“$”

並且頁眉和頁腳文本格式為粗體。

這是表：

<table id="idtablainforme_ventaporfamilia" class="table table-striped table-striped table-bordered nowrap dataTable">
    <thead>
        <tr>
            <th>
                <b>FAMILIA</b>
            </th>
            <th>
                <b>VENTA</b>
            </th>
        </tr>
    </thead>
    <tfoot>
        <tr>
            <th><b>TOTAL</b></th>
            <th><b>$12.925.150</b></th>
        </tr>
    </tfoot>
    <tbody>
        <tr><td>CHEQUERA MUJER</td><td>$5.231.760</td></tr>
        <tr><td>CARTERA</td><td>$3.487.630</td></tr>
        <tr><td>BILLETERA MUJER</td><td>$2.155.120</td></tr>
        <tr><td>NECESER</td><td>$21.980</td></tr>
        <tr><td>COSMETIQUERA</td><td>$10.990</td></tr>
        <tr><td>SET DE VIAJE</td><td>$10.990</td></tr>
    </tbody>
</table>

這是我的嘗試：

<script>
    $('#idtablainforme_ventaporfamilia').DataTable({
        destroy: true,
        "searching": false,
        "paging": false,
        "ordering": false,
        "info": false,
        "autowidth": false,
        columns: [
           { data: "1", render: $.fn.dataTable.render.text() },
           { data: "2", render: $.fn.dataTable.render.number('.', ',', 0, '$') }
        ],
        footerCallback: function (tfoot, data, start, end, display) {
            var $th = $(tfoot).find('th').eq(1);
            $th.text($.fn.dataTable.render.number('.', ',', 0, '$').display($th.text()))
        },
        dom: 'Bfrtip',
        buttons: [
            {
                extend: 'excel',
                footer: true,
                title: 'INFORME DE VENTAS POR FAMILIA',
                text: '<i class="fa fa-file-excel-o"></i>',
                titleAttr: 'Exporta a EXCEL',
            }
        ]
    });
</script>

但它不會轉換數字數據，並且頁眉和頁腳文本不會被格式化為粗體。 它們在 Excel 中作為字符串導出，除了值 21.98 $、10.99 $ 和 10.99 $（雖然它們應該是 $21.980、$10.990 和 $10.990），如下所示：

FAMILIA         VENTA
CHEQUERA MUJER  $5.494.310
CARTERA         $5.231.760
BILLETERA MUJER $2.155.120
NECESER         21.98  $
COSMETIQUERA    10.99  $
SET DE VIAJE    10.99  $
TOTAL           $12.925.150

Answer 1

出現在右側的貨幣符號（ $ ）是一個已知錯誤 ，DataTables的創建者知道這個錯誤 。

至於其他事情，我創建了一個演示

並基於此：

• 您使用美元符號預先填充金額（至少根據您發布的HTML代碼）; 不要那樣做！ 只提供數值

• 頁眉和頁腳確實是大膽的，都在顯示（屏幕右下方拍攝）和出口到excel; 檢查以確保未覆蓋CSS。

也就是說， 檢查DataTables提供的其他格式化需求 。

編輯：

我不知道為什么我發布的JSFiddle鏈接不包含其他庫...但是為了您的參考，下面的屏幕截圖顯示了我重新構建您的案例中包含的JS / CSS庫：

Answer 2

我發現，為了獲得您在產品中可能使用的所有數據表所需的一些樣式，如果您需要更自動化的東西而不必經常進行一些編輯，就需要對buttons.html.js進行一些編輯。按表設置。

這是因為這些設置尚未烘焙到API中。 因此，請確保跟蹤您的編輯內容，以確保在將來更新來自數據表時知道該怎么做。

對於右邊的$，具體來說，我在插件文件中進行了以下編輯：

在第567行（在我的版本中）或在該行周圍查找此代碼塊：

        '<numFmts count="6">'+
            '<numFmt numFmtId="164" formatCode="#,##0.00_-\ [$$-45C]"/>'+
            '<numFmt numFmtId="165" formatCode="&quot;£&quot;#,##0.00"/>'+
            '<numFmt numFmtId="166" formatCode="[$€-2]\ #,##0.00"/>'+
            '<numFmt numFmtId="167" formatCode="0.0%"/>'+
            '<numFmt numFmtId="168" formatCode="#,##0;(#,##0)"/>'+
            '<numFmt numFmtId="169" formatCode="#,##0.00;(#,##0.00)"/>'+
        '</numFmts>'+

在最后一個numFmt 169之后添加一個新條目：

'<numFmt formatCode="$#,##0.00_);[Red]($#,##0.00)" numFmtId="170"></numFmt>'

這種特殊的格式將數字左邊的$使用逗號作為千位分隔符，並將負數放在紅色和括號中。 如果您需要不同的格式，只需打開Excel並使用自定義格式化選項查找所需的格式，然后將其提供的格式復制並粘貼到“formatCode”attr中。

接下來，您需要創建它，以便您可以訪問您創建的這種新樣式。 所以找到結束標記：

'</cellXfs>'+

就在此之前，將有67個左右的線類似於：

'<xf numFmtId="1" fontId="0" fillId="0" borderId="0" applyFont="1" applyFill="1" applyBorder="1" xfId="0" applyNumberFormat="1"/>'+
'<xf numFmtId="2" fontId="0" fillId="0" borderId="0" applyFont="1" applyFill="1" applyBorder="1" xfId="0" applyNumberFormat="1"/>'+

就在關閉標簽之前添加：

'<xf numFmtId="170" fontId="0" fillId="0" borderId="0" xfId="0" applyFont="1" applyFill="1" applyBorder="1" applyAlignment="1"></xf>'+

請注意，numFmtId =“170”與之前的numFmts條目匹配。 現在，您可以將該部分的開頭標記從66調整到67：

'<cellXfs count="67">'+

變為：

'<cellXfs count="68">'+

現在你需要做的最后一件事就是自動獲取所有美元格式的單元格：

找：

var _excelSpecials = [

在該數組中，您將注意到一些找到各種正則表達式模式並應用樣式編號的行。 更換：

{ match: /^\-?\$[\d,]+.?\d*$/,  style: 57 }, // Dollars

用你的新款號

{ match: /^\-?\$[\d,]+.?\d*$/,  style: 67 }, // Dollars

該數字對應於您的樣式在cellXfs列表中的位置。 它是第67個（從0索引，因此項68是索引67）條目。

如果您需要構建，然后使用數據表刷新瀏覽器並嘗試導出。 它應該與匹配格式的任何美元字段的新格式一起使用。

使用此方法，您可以將其他樣式添加到DataTables提供的默認列表中。 這不是最佳解決方案，但是直到htm5按鈕API可以將這種更新作為障礙處理，這是我發現的最佳方式，並且比在一天結束時擁有自定義CSS文件更糟糕。 只需跟蹤您對未來的編輯，如果您控制文件，那么無論如何它都會為您完成。

希望這可以幫助！ 我還在摔跤其他一些東西，但也許我到目前為止發現的東西對於有類似問題的其他人也會有用。

Answer 3

我最終使用格式輸出數據 - 導出選項來自https://datatables.net/extensions/buttons/examples/html5/outputFormat-orthogonal.html

<table id="example" class="display" style="width:100%">
        <thead>
            <tr>
                <th>Name</th>
                <th>Position</th>
                <th>Office</th>
                <th>Extn.</th>
                <th>Start date</th>
                <th>Salary</th>
            </tr>
        </thead>
        <tfoot>
            <tr>
                <th>Name</th>
                <th>Position</th>
                <th>Office</th>
                <th>Extn.</th>
                <th>Start date</th>
                <th>Salary</th>
            </tr>
        </tfoot>
    </table>

$(document).ready(function() {
    $('#example').DataTable( {
        ajax: '../../../../examples/ajax/data/objects.txt',
        columns: [
            { data: 'name' },
            { data: 'position' },
            { data: 'office' },
            { data: 'extn' },
            { data: 'start_date' },
            { data: 'salary', render: function (data, type, row) {
                return type === 'export' ?
                    data.replace( /[$,]/g, '' ) :
                    data;
            } }
        ],
        dom: 'Bfrtip',
        buttons: [
            {
                extend: 'copyHtml5',
                exportOptions: { orthogonal: 'export' }
            },
            {
                extend: 'excelHtml5',
                exportOptions: { orthogonal: 'export' }
            },
            {
                extend: 'pdfHtml5',
                exportOptions: { orthogonal: 'export' }
            }
        ]
    } );
} );

Answer 4

只需將樣式設置為64，它將刪除$符號。

$（'row [r！= 2] c [r ^ =“B”]'，sheet）.attr（'s'，'64'）;

Answer 5

在 Excel 中 - 用於從b-html5.datatables.js構建基本 XLSX 文件的預定義字符串

實際字符串格式錯誤..

<numFmt numFmtId="164" formatCode="#,##0.00_-\ [$$-45C]"/>

只需將 formatCode 替換為：

<numFmt numFmtId="164" formatCode="[$$-45C]\#,##0.00"/>

它適用於任何行的數據，包括頁眉和頁腳值。