Question

包含列的表包含不同的元素，需要： 1）找到名为price的输入名称的结果 2）使用price的值在此列的页脚中对此输入求和。

我尝试了很多方法，但没有成功，请帮助。

var table = $('#example').DataTable({
// I Need datatable find input=price
// sum all column

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js"></script>
<link href="https://cdn.datatables.net/1.10.12/css/jquery.dataTables.min.css" rel="stylesheet"/>

<table id="example">
<thead>
    <tr>
        <th>Rendering engine</th>
        <th>Browser</th>
        <th>Platform(s)</th>
        <th>Engine version</th>
        <th>CSS grade</th>
        <th>price</th>
    </tr>
</thead>
<tfoot class='footer'>
    <tr>
        <th>Rendering engine</th>
        <th>Browser</th>
        <th>Platform(s)</th>
        <th>Engine version</th>
        <th>CSS grade</th>
        <th>price</th>
    </tr>
</tfoot>
<tfoot class='custo'>
  <tr >
      <th colspan=5 style=text-align:right>Total:</th>
      <th></th>
  </tr>
</tfoot>
<tbody>
    <tr>
        <td>Trident</td>
        <td>Internet Explorer 4.0</td>
        <td>Win 95+</td>
        <td> 4</td>
        <td>X</td>
        <td><input name='price' value='R$ 1.000,00'><input name='percent' value='10%'></td>
    </tr>
    <tr>
        <td>Trident</td>
        <td>Internet Explorer 5.0</td>
        <td>Win 95+</td>
        <td>5</td>
        <td>C</td>
        <td><input name='price' value='R$ 2.000,00'><input name='percent' value='10%'></td>
    </tr>
    <tr>
        <td>Trident</td>
        <td>Internet Explorer 5.5</td>
        <td>Win 95+</td>
        <td>5.5</td>
        <td>A</td>
        <td><input name='price' value='R$ 3.000,00'><input name='percent' value='10%'></td>
    </tr>
</tbody>

Answer 1

首先将3.000,00更改为3,000.00并使用$( "#example input[name='price']" ).each循环显示价格以计算总和

sum=0;
$( "#example input[name='price']" ).each(function() {
var prc=$( this ).val().replace(',','').split(' ');
sum+=parseInt(prc[1])*1;
});
$('.custo > th:nth-child(2)').html('R$ '+sum);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js"></script>
<link href="https://cdn.datatables.net/1.10.12/css/jquery.dataTables.min.css" rel="stylesheet"/>

<table id="example">
<thead>
    <tr>
        <th>Rendering engine</th>
        <th>Browser</th>
        <th>Platform(s)</th>
        <th>Engine version</th>
        <th>CSS grade</th>
        <th>price</th>
    </tr>
</thead>
<tfoot class='footer'>
    <tr>
        <th>Rendering engine</th>
        <th>Browser</th>
        <th>Platform(s)</th>
        <th>Engine version</th>
        <th>CSS grade</th>
        <th>price</th>
    </tr>
  <tr class="custo" >
      <th colspan="5" style="text-align:right">Total:</th>
      <th></th>
  </tr>
</tfoot>
<tbody>
    <tr>
        <td>Trident</td>
        <td>Internet Explorer 4.0</td>
        <td>Win 95+</td>
        <td> 4</td>
        <td>X</td>
        <td><input name='price' value='R$ 1,000.00'><input name='percent' value='10%'></td>
    </tr>
    <tr>
        <td>Trident</td>
        <td>Internet Explorer 5.0</td>
        <td>Win 95+</td>
        <td>5</td>
        <td>C</td>
        <td><input name='price' value='R$ 2,000.00'><input name='percent' value='10%'></td>
    </tr>
    <tr>
        <td>Trident</td>
        <td>Internet Explorer 5.5</td>
        <td>Win 95+</td>
        <td>5.5</td>
        <td>A</td>
        <td><input name='price' value='R$ 3,000.00'><input name='percent' value='10%'></td>
    </tr>
</tbody>

datatable汇总包含不同元素的列

1 个答案: