DataTables,计算列

bla*_*cat 4 datatable jquery datatables

我正在尝试使用DataTable插件在我的表中创建一个列,该插件是使用前两列中的值计算的.

像这样...... .. (价格)(QTY)=总计

|| Price || QTY || Total||
==========================
||  5    ||  2  ||  10  ||
||  10   ||  3  ||  30  ||
||  4    ||  1  ||  4   ||
Run Code Online (Sandbox Code Playgroud)

我觉得它应该很简单,但我无法让它发挥作用.这是我试图遵循的类似问题.

这是我正在初始化表的JS文件

var table = $('#tempPOs').DataTable( {
        dom: 'frtip', //Bfrtip (removed the B to get rid of the buttons)
        ajax: '/inventory/DTResources/php/table.tempPOs.php',
        columns: [
        { "data": "pmkPart" },
        { "data": "PartNumber" },
        { "data": "Description" },
        { "data": "fnkManufacturer" },
        { "data": "Notes" },
        { "data": "EachPrice", render: $.fn.dataTable.render.number( ',', '.', 0, '$' ) },
        { "data": "Quantity" },
        { "data": "Username" },
        {
            data: null,
            className: "center",
            defaultContent: '<a href="" class="editor_remove">Remove</a>'
        }
        ],
        select: true,
        lengthChange: false,
        buttons: [
        { extend: 'create', editor: editor },
        { extend: 'edit',   editor: editor },
        { extend: 'remove', editor: editor }
        ],

    } );
Run Code Online (Sandbox Code Playgroud)

这是我的HTML

<th>Part ID</th>
<th>Part Number</th>
<th>Description</th>
<th>Manufacturer</th>
<th>Notes</th>
<th>Part Price</th>
<th>Quantity</th>
<th>Username</th>
<th>Total Price</th>
<th>Remove</th>
Run Code Online (Sandbox Code Playgroud)

有人能指出我正确的方向吗?

Chr*_* H. 10

您可以使用render类似于您"EachPrice"在场中使用它的选项.如果您想获得更多信息,请在此处记录内置函数,但我将在下面概述它的样子.

columns: [
    /*other columns omitted for example*/
    { 
        "data": null, //data is null since we want to access ALL data
                      //for the sake of our calculation below
        "render": function(data,type,row) { return (data["price"] * data["quantity"])}
    }

],
Run Code Online (Sandbox Code Playgroud)

通过这种方式,您可以使用其他列data来呈现此列的输出.

只要可以使用函数计算,此选项可用于显示您想要的任何内容.如果您想获得有关该render选项用法的更多信息,请查看上面的链接.