javascript - 呈现货币和符号并与来自不同单元格的数据结合

Question

我正在使用最新的 jQuery DataTables v1.10.7我正在尝试将数字解析为以下格式:$239.90 USD

我能够使用此命令使货币工作:

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

但是这个输出是 $239.90 没有 USD

USD 应该来 self 在名为 Currency 的不同行中的其他数据:row['Currency']

我想做的是这样的:

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

但我不明白如何将渲染结果保存到 var v 中，这是行不通的。

Answer 1

使用下面的代码代替列定义。

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 = "£";

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

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

请参阅下面的示例进行演示。

$(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 = "£";
               
               } else if(abbr == "EUR"){
                 symbol = "€";
               }
                 
               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>