Render currency and symbol and combine with data from a different cell

问题

I am working with latest jQuery DataTables v1.10.7 and I am trying to parse a number into the following format: $239.90 USD

I am being able make the currency working with this command:

columns: [
    { data: "Price", render: $.fn.dataTable.render.number(',', '.', 2, '$') },

however the output of this is $239.90 without the USD

the USD should be coming from other data that I have in a different row named Currency: row['Currency']

What I'm trying to do is something like this:

columns: [
{
    data: "Price",
    render: function (data, type, row) {
       var v = $.fn.dataTable.render.number(',', '.', 2, '$');
       return data + ' ' + row['Currency'];
    }
},

but I don't understand how I can keep the result of the render into var v, this is not working.

回答1:

Use the code below instead for column definition.

columns: [
{
    data: "Price",
    render: function (data, type, row, meta) {
       if(type === 'display'){
          var abbr = row['Currency'];

          var symbol = "";              
          if(abbr == "USD"){
             symbol = "$";

          } else if(abbr == "GBP"){
             symbol = "&pound;";

          } else if(abbr == "EUR"){
             symbol = "&euro;";
          }

          var num = $.fn.dataTable.render.number(',', '.', 2, symbol).display(data);              
          return num + ' ' + abbr;           
       } else {           
          return data;
       }
    }
},

See the example below for demonstration.

$(document).ready(function() {
   var table = $('#example').DataTable({
     'columns': [
       null,
       null,
       null,
       null,
       null,
       { 
         render: function(data, type, row, meta){
            if(type === 'display'){
               var abbr = "EUR";
              
               var symbol = "";              
               if(abbr == "USD"){
                 symbol = "$";
               
               } else if(abbr == "GBP"){
                 symbol = "&pound;";
               
               } else if(abbr == "EUR"){
                 symbol = "&euro;";
               }
                 
               var num = $.fn.dataTable.render.number(',', '.', 2, symbol).display(data);              
               return num + ' ' + abbr;           
              
            } else {
               return data;
            }
         }
       }
     ]
   });
});

<link href="http://datatables.net/release-datatables/media/css/jquery.dataTables.css" rel="stylesheet"/>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="http://datatables.net/release-datatables/media/js/jquery.dataTables.js"></script>

<table id="example" class="display" cellspacing="0" width="100%">
    <thead>
        <tr>
            <th>Name</th>
            <th>Position</th>
            <th>Office</th>
            <th>Age</th>
            <th>Start date</th>
            <th>Salary</th>
        </tr>
    </thead>
 
    <tfoot>
        <tr>
            <th>Name</th>
            <th>Position</th>
            <th>Office</th>
            <th>Age</th>
            <th>Start date</th>
            <th>Salary</th>
        </tr>
    </tfoot>
 
    <tbody>
        <tr>
            <td>Tiger Nixon</td>
            <td>System Architect</td>
            <td>Edinburgh</td>
            <td>61</td>
            <td>2011/04/25</td>
            <td>320800</td>
        </tr>
        <tr>
            <td>Garrett Winters</td>
            <td>Accountant</td>
            <td>Tokyo</td>
            <td>63</td>
            <td>2011/07/25</td>
            <td>170750</td>
        </tr>
        <tr>
            <td>Ashton Cox</td>
            <td>Junior Technical Author</td>
            <td>San Francisco</td>
            <td>66</td>
            <td>2009/01/12</td>
            <td>86000</td>
        </tr>
    </tbody>
</table>

回答2:

1 Answer

It's Work for me

{
  "data": "Quality", "name": "Quality", "autoWidth": true,
  render: function (data, type, row) {
          var iData = $.fn.dataTable.render.number(',').display(data); 
          return '<a class="editable editable-click fa fa-minus-square" style="color:firebrick"></a> ' +
                 '<span>' + iData + '</span> ' +
                 '<div class="fa fa-plus-square" style="color:forestgreen"></div>';
          }

  },

来源：https://stackoverflow.com/questions/30984339/render-currency-and-symbol-and-combine-with-data-from-a-different-cell

标签

javascript

jquery

datatables