format amount column in jquery datatable as $ and thousand place as comma
<p>I am using jquery datatable and I have one column which is currently displaying amount with decimal.
I want to append $ in the beginning and put comma for thousand place.
Eg. Current its displaying as : 1526 or 1013.7 </p>

<p>So It should display as $1,526 and $1,013.7</p>

<p>But most importantly it shouldn't break sorting functionality.</p>

<p>Code I am using is as below</p>

<p>first on page load :</p>

<pre><code>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 = "&lt;a href='#'  ng-click='$event.preventDefault(); OpenClientInfo(" + data + ")'&gt;Get Client Details&lt;/a&gt;";
                            return hyperLink; //'&lt;a href="Index/' + data + '"&gt;' + data + '&lt;/a&gt;';
                        }
                    },
                    { "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("&lt;i class='separator'&gt;&lt;/i&gt;");
            $('.panel-ctrls').append($('.dataTables_length').addClass("pull-left")).find("label").addClass("panel-ctrls-center");

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

            $('.dataTables_filter input').attr("placeholder", "Search...");
</code></pre>

<p>then on button click :</p>

<pre><code> requestTable.clear();
        requestTable.draw();
        requestTable.rows.add(data);
        requestTable.draw();
</code></pre>

<p>As you can see I already tried </p>

<pre><code>"language": {
                    "lengthMenu": "_MENU_",
                    "thousands": ","
                }
</code></pre>

<p>and providing type <code>{ "type": "num", "targets": 5 }</code> but none of them worked</p>