Question

我正在使用jQuery数据表来显示包含2个日期列的HTML表。每个日期列都将日期作为unix时间戳。我使用渲染函数和moment.js来改变这个dd-mm-yyyy。但是，这并没有很好地排序，所以我添加了数据顺序属性。不幸的是，这会破坏我的渲染功能，因为渲染函数现在获得了一个类型参数“type”。我在下面提供了一个示例。有人可以帮忙吗？

<!DOCTYPE html>

<body>
    <table class="tablesaw table-bordered table-hover table" id="list-tbl" data-tablesaw-mode="sort" data-tablesaw-sortable data-tablesaw-sortable-switch>
        <thead>
            <tr>
                <th scope="col" data-tablesaw-sortable-col data-tablesaw-sortable-default-col data-tablesaw-priority="persist">Date 1</th>
                <th scope="col">Text</th>       
                <th scope="col">Date 2</th>
            </tr>
        </thead>

        <tbody>
            <tr>
                <td data-order="1510185600a">1510185600</td>
                <td>4: 09-11-2017 --- </td>
                <td data-order="1512777600">1512777600</td>
            </tr>
            <tr>
                <td data-order="1491264000a">1491264000</td>
                <td>1: 04-04-2017 --- </td>
                <td data-order="1493856000">1493856000</td>
            </tr>
            <tr>
                <td data-order="1504569600a">1504569600</td>
                <td>3: 05-09-2017 ---</td>
                <td data-order="1507161600">1507161600</td>
            </tr>
            <tr>
                <td data-order="1498780800a">1498780800</td>
                <td>2: 30-06-2017 --- </td>
                <td data-order="1498780800">1498780800</td>
            </tr>
        </tbody>
    </table>
    <script>
        $(document).ready(function() {
            $('#list-tbl').DataTable({
                "columnDefs": [
                    {
                        targets: [0],
                        //data: 0,
                        render: function (data, type, row) {
                            if (type === 'sort')
                                return data;
                            if (type === 'filter')
                            {
                                row[0].display='1';
                                return 'frd';
                            }
                            if (type === 'type' || type === 'sort' || type === 'filter')
                            {
                                row[0].display='1';
                                return 'test';
                            }                                   return 'kev';
                            //if (type === 'type')
                            //{
                                //row[0].display = moment.unix(row[0].display).format("DD-MM-YYYY");
                                //row[2].display = moment.unix(row[2].display).format("DD-MM-YYYY");
                                //var s = moment.unix(data).format("DD-MM-YYYY");
                                //return s;
                            //}
                            //return data;
                            //return moment.unix(data).format("DD-MM-YYYY");
                            if (type === 'display')
                                return 'kev';

                        }
                    }
                ],
                "aLengthMenu": [[10, 25, 50, 100, -1], [10, 25, 50, 100, "All"]],
                "pageLength": 25
            });
        } );
    </script>
</body>

Answer 1

无需使用moment.js或任何其他插件进行数据排序，而是使用 data-sort属性。您需要将日期转换为数字值，如下所示

例如：

<td scope="row" data-sort="' + Date.parse(<your date>)).valueOf() + '">Your date </td>'

这将正确排序日期。我刚刚实现了相同的

jQuery Datatables Date按数据顺序和渲染排序

1 个答案: