Question

我想用以下参数构建一个DataTable。

var table3 = $('#msg').dataTable({
    "scrollY":          calcDataTableHeight(),
    "scrollCollapse":   true,
    "paging":           false,
    "bInfo":            false,
    "order":            [[0, "desc"]],
    "dom": "Tfrtip",
    "ajax": {
        "url": "includes/DataTables-1.10.4/extensions/Editor-1.3.3/php/table.msg.php",
        "data": function (d){
            d.cat = cat;
        },
        "type": "POST"
    }
});

某些参数取决于变量。因此，如果需要，我想将这些添加到对象中。

if (buttons == true) {
add this to table 3
        "tableTools": {
        "sRowSelect": "os",
        "aButtons": [
            { "sExtends": "editor_create", "editor": editor },
            { "sExtends": "editor_edit",   "editor": editor },
            { "sExtends": "editor_remove", "editor": editor }
        ]
    }

我该怎么做？我尝试了很多，但没有任何作用。

Answer 1

将您的选项构建为对象，然后在完成后将其传递给DataTables。

例如：

 var options = {
    "scrollY":          calcDataTableHeight(),
    "scrollCollapse":   true,
    "paging":           false,
    "bInfo":            false,
    "order":            [[0, "desc"]],
    "dom": "Tfrtip",
    "ajax": {
        "url": "includes/DataTables-1.10.4/extensions/Editor-1.3.3/php/table.msg.php",
        "data": function (d){
            d.cat = cat;
        },
        "type": "POST"
    }
};

if (buttons == true) {
   options['tableTools'] = {
      "sRowSelect": "os",
      "aButtons": [
         { "sExtends": "editor_create", "editor": editor },
         { "sExtends": "editor_edit",   "editor": editor }
      ]
   };

   if (showRemoveBtn) {
      options['tableTools']['aButtons'].push(
         { "sExtends": "editor_remove", "editor": editor }
      );
   }
}

var table3 = $('#msg').dataTable(options);

如果您愿意，也可以使用$.extend完成。

Answer 2

如果您需要使用不同的参数初始化插件，可以通过扩展选项来构建一个可以为您处理的插图函数：

var showDataTable = (function($) {

    var _defaults = {
        "scrollY":        calcDataTableHeight(),
        "scrollCollapse": true,
        "paging":         false,
        "bInfo":          false,
        "order":          [[0, "desc"]],
        "dom":            "Tfrtip",
        "ajax": {
            "url": "includes/DataTables-1.10.4/extensions/Editor-1.3.3/php/table.msg.php",
            "type": "POST",
            "data": function (data) {
                //do something with data
            }
        }
    };

    function calcDataTableHeight() {
        //implementation
    }

    // Initializes "dataTable" plugin
    function showDataTable (selector, options) {
        if (!selector) return;
        var config = $.extend(true, {}, _defaults, options);
        return $(selector).dataTable(config);
    }

    return showDataTable;
}(jQuery));

您可以按照以下方式使用它：

if (buttons) {
    //initializes by extending options
    showDataTable("#msg", {
        "tableTools": {
            "sRowSelect": "os",
            "aButtons": [
                { "sExtends": "editor_create", "editor": editor },
                { "sExtends": "editor_edit",   "editor": editor },
                { "sExtends": "editor_remove", "editor": editor }
            ]
        }
    });
} else {
    //initializes with default options
    showDataTable("#msg");
}

如何在javascript对象中添加参数（DataTables）？

2 个答案: