时间戳

首页 > 解决方案 > 数据表脚本 DOM

datatables - 数据表脚本 DOM

问题描述

我正在使用数据表，我已经创建了这个 javascript 代码

table = $('#examples').DataTable({
        "ajax": {
            type: "POST",
            url: "./../../" + "/back-end/switch-ajax-listening/switch-ajax-listening.php",
            dataType: "json",
            data:
                {
                    actionId: "page1GetAll"
                }

        },
        dom : "B<'row'<'col-sm-6'l><'col-sm-6'f>><'row'<'col-sm-12'tr>><'row'<'col-sm-5'i><'col-sm-7'<'#colvis'>p>>",
        "buttons": [

            {
                extend: 'colvis',
                postfixButtons: [ 'colvisRestore' ],
                container : '#colvis',
                columns: '0,1,2,3,4,5'
            }
        ],
        responsive: true,

        "columns": [
            { "data": "idSelectPacketName"},
            { "data": "idSelectCompany" },
            {"data":null,"defaultContent":"<button>View</button>"}

        ], 
    });

它工作得很好，但我无法理解这部分：

"B<'row'<'col-sm-6'l><'col-sm-6'f>><'row'<'col-sm-12'tr>><'row'<'col-sm-5'i><'col-sm-7'<'#colvis'>p>>"

我没有编写从示例中复制的这个字符串，但我无法理解它是如何工作的。或者你知道一个很好地理解这个字符串的指南吗？

因为我的问题是有时按钮与表格不对齐，您有什么想法可以解决吗？谢谢。

标签： datatables

解决方案

正如作者自己承认的那样，这有点古怪，现在，您需要将 Datatables 键字放在 html 标记中的正确位置。就像是：

 dom : "<'row'<'col-sm-6'lB><'col-sm-6'f>><'row'<'col-sm-12'tr>><'row'<'col-sm-5'i><'col-sm-7'<'#colvis'>p>>",

（将“B”放在“l”之后）

您可能还必须使用 CSS 来获得所需的布局。

推荐阅读