jquery datatable中的format amount列为$和千位为逗号

时间:2016-11-24 14:03:37

标签: jquery datatables

我正在使用jquery数据表,我有一列当前显示带小数的数量。 我想在开头追加$并将逗号放在千位。 例如。目前显示为:1526或1013.7

所以它应显示为$ 1,526和$ 1,013.7

但最重要的是,它不应该破坏排序功能。

我使用的代码如下

首页加载:

var requestTable =
            $('#tblCustomerGrid')
            .DataTable({
                data: data,
                "columnDefs": [
                    {
                        "targets": 0,
                        "data": "clientId",
                        "fnCreatedCell": function (nTd, sData, oData, iRow, iCol) {
                            $compile(nTd)($scope);
                        },
                        "orderable": false,
                        "searchable": false,
                        "render": function (data, type, full, meta) {
                            var hyperLink = "<a href='#'  ng-click='$event.preventDefault(); OpenClientInfo(" + data + ")'>Get Client Details</a>";
                            return hyperLink; //'<a href="Index/' + data + '">' + data + '</a>';
                        }
                    },
                    { "type": "num", "targets": 5 }
                ],
                "columns": [
                    { "data": "clientId" },
                    { "data": "fullName" },
                    { "data": "email" },
                    { "data": "countryName" },
                    { "data": "phone" },
                    { "data": "grandTotal" }
                ],
                "language": {
                    "lengthMenu": "_MENU_",
                    "thousands": ","
                }
            });

$('.panel-ctrls').append($('.dataTables_filter').addClass("pull-right")).find("label").addClass("panel-ctrls-center");
            $('.panel-ctrls').append("<i class='separator'></i>");
            $('.panel-ctrls').append($('.dataTables_length').addClass("pull-left")).find("label").addClass("panel-ctrls-center");

            $('.panel-footer').append($(".dataTable+.row"));
            $('.dataTables_paginate>ul.pagination').addClass("pull-right m-n");

            $('.dataTables_filter input').attr("placeholder", "Search...");

然后点击按钮:

 requestTable.clear();
        requestTable.draw();
        requestTable.rows.add(data);
        requestTable.draw();

如你所见,我已经尝试了

"language": {
                    "lengthMenu": "_MENU_",
                    "thousands": ","
                }

并提供类型{ "type": "num", "targets": 5 },但没有一个工作

2 个答案:

答案 0 :(得分:3)

Datatables具有此

的构建函数
   "columns": [
                { "data": "clientId" },
                { "data": "fullName" },
                { "data": "email" },
                { "data": "countryName" },
                { "data": "phone" },
                { "data": "grandTotal", 
                   render: $.fn.dataTable.render.number( ',', '.', 2, '$' ) }

它还允许更多自定义

https://datatables.net/manual/data/renderers

答案 1 :(得分:0)

在这里我们也可以为多列设置格式

如果要在小数点(。)和千位分隔符(,)之类的格式以及货币符号在($)位置之类的货币符号,则遵循以下格式

var ib_dt = $('#ib_dt').DataTable( {

        "columnDefs": [
                { "orderable": false,
                  "render": $.fn.dataTable.render.number( ',', '.', 2, '$','' ),
                  "targets":[3,4,5],
                }
            ],
});

如果要使用小数(,)和千位分隔符(。)之类的格式,并在金额后使用货币符号之类的(Fr)位置,则请遵循以下步骤

 var ib_dt = $('#ib_dt').DataTable( {

          "columnDefs": [
                { "orderable": false,
                  "render": $.fn.dataTable.render.number( '.', ',', 2, '','Fr' ),
                  "targets":[3,4,5],
                }
            ],
 });