jQuery dataTable为特定的引导模式设置页面限制

jQuery dataTable set page limit for specific bootstrap modal

本文关键字:设置 模式 dataTable jQuery      更新时间:2023-09-26

我在同一页中有三个、四个,有时还有五个表,但它们大多在模式对话框中。结果是,我希望不在模式对话框中的表每页显示10个项目,而在模式对话框的表则显示在3上。

您可以在jsfiddle中查看一个工作示例。

我用以下参数初始化我的设置(默认情况下):

var settings = {
        "bPaginate": true,
            "bLengthChange": false,
            "bInfo": true,
            "bAutoWidth": false,
            'aoColumnDefs': [{
            'bSortable': false,
                'aTargets': ['nosorting']
        }],
            'order': [
            [0, 'DESC']
        ]
    }

默认情况下,每页限制10条记录。之后,我需要验证该表是否属于模态,如果是,请添加一个属性名称"pageLength"来指定限制。

if ($(this).closest('.fade').length > 0) {
    settings.push({
       "pageLength": 3
    });
}

我认为其中一个问题是因为设置实际上不是一个对象数组,我应该有这样的东西:var设置=[];

settings.push({bPaginate: true, bLengthChange: false}); // etc
// or
settings.push({"bPaginate": true, "bLengthChange: false"}); // etc

但是如果我使用这个方法,当我将这个变量添加到插件中时,dataTable将无法识别它。

$('.dataTable').dataTable(settings);

试试这个例子。它循环所有表,并使用正确的设置逐个创建它们。

js对象中的设置。你可以像settings.pageLength.一样简单地否决它

if ($('.dataTable').length > 0) {
    var settings = {
        "bPaginate": true,
            "bLengthChange": false,
            "bInfo": true,
            "bAutoWidth": false,
            'aoColumnDefs': [{
            'bSortable': false,
                'aTargets': ['nosorting']
        }],
            'order': [
            [0, 'DESC']
        ]
    }
    $('.dataTable').each(function () {
        if ($(this).closest('.fade').length > 0) {
            settings.pageLength = 3;
        }
        $(this).dataTable(settings);

    });
    $('.dataTables_filter').empty();
}