将 jquery 数据表中的金额列格式化为 $ 并将千位格式化为逗号

Question

我正在使用 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 }但没有一个工作

Answer 1

Datatables 有一个 build inn 函数

   "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