问动态渲染帮助
EN

Stack Overflow用户

提问于 2022-02-20 16:29:02

回答 1查看 123关注 0票数 0

我想动态地格式化列。数据设备也有内置的帮手。以下代码起作用：

  render: $.fn.dataTable.render.number( ',', '.', 0)

但是我试图在创建表后格式化，因为格式化依赖于用户的输入。下面的代码不工作。

$('#mytable').DataTable().column(2).render.number(',', '.', 0);

var oldCurrency = 'usd';
var newCurrency = 'usd';

var myTable = $('#mytable').DataTable({
    sDom: 't',
    columns:[
      {data: 'item', title: 'Item'},
      {data: 'descr', title: 'Description'},
      {data: 'cost', title: 'Cost', render: function(data, type, row){
        var exchangeRate = {usd: 1, eur: 0.87, gbp: 0.78};
        row.cost = row.cost*exchangeRate[newCurrency]/exchangeRate[oldCurrency];
        return row.cost;
      }}
    ]
  });
  
$('#currency').on('focus', function(){
    oldCurrency = this.value;
});

$('#currency').on('change', function(){
    newCurrency = this.value;
  myTable.draw();
});

<!DOCTYPE html>
<html>
<head>
  <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
  <script src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
  <script src="test.js"></script>
  <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css">
</head>
<body>
  <select id="currency">
    <option value="usd">USD</option>
    <option value="eur">EUR</option>
    <option value="gbp">GBP</option>
  </select>
  <table id="mytable">
    <thead>
      <th>Item</th>
      <th>Description</th>
      <th>Cost</th>
    </thead>
    <tbody>
      <tr>
        <td>pen</td>
        <td>writing tool</td>
        <td>5.5</td>
      </tr>
      <tr>
        <td>pencil</td>
        <td>wooden stick</td>
        <td>4.8</td>
      </tr>
      <tr>
        <td>eraser</td>
        <td>piece of rubber</td>
        <td>1.2</td>
      </tr>
    </tbody>
  </table>
</body>
</html>

javascript

datatables

回答 1

Stack Overflow用户

发布于 2022-02-20 22:55:12

您可以使这些行无效，这样DataTables就可以在()上重新呈现数据：

$('#currency').on('change', function(){
    newCurrency = this.value;
    myTable.rows().invalidate('data').draw();
});

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/71196383

复制

相似问题

问动态渲染帮助
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问动态渲染帮助EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问动态渲染帮助
EN