Question

我使用dataTables在一个页面上有几个表格。每个人都需要拥有自己的'AjaxSource'。我似乎无法弄明白该怎么做。这是我的最小代码：

         var oTable = $('.datatable').dataTable( {
                "bProcessing": true,
                "sAjaxSource": "/ajax/function",
                "bSort": false,
                "fnDrawCallback": function() {
                       //some click events initilized here
                 }
            });

这基本上是裸骨设置。每个表作为数据表类和唯一ID。但不确定如何根据特定的表更改AjaxSource。

谢谢！

编辑：

这是我最终做的事情：

        $('.datatable').each(function(index){

             $('#'+$(this).attr('id')).dataTable( {
                "bProcessing": true,
                "sAjaxSource": $(this).children('caption').html(),
                "bSort": false,
                "fnDrawCallback": function() {
                 }
            });
        });

在表格中，我放置了一个由css隐藏的标题标记，并包含Ajax源URL。它遍历每个实例并抓取网址。

到目前为止，这似乎有效！

Answer 1

这不起作用吗？它使用id而不是类来唯一标识每个数据表，并根据id为每个表附加一个单独的源。

  var oTable = $('#FirstDataTableID').dataTable( {
            "bProcessing": true,
            "sAjaxSource": "/ajax/function",
            "bSort": false,
            "fnDrawCallback": function() {
                   //some click events initilized here
             }
        });

  var oTable = $('#SecondDataTableID').dataTable( {
            "bProcessing": true,
            "sAjaxSource": "/ajax/other_function",
            "bSort": false,
            "fnDrawCallback": function() {
                   //some click events initilized here
             }
        });

Answer 2

我遇到了同样的问题，我使用类似于你的html5数据属性和初始化代码解决了这个问题：

$('.dataTableServer').each(function () {
        var source = $(this).attr("data-source");
        $(this).dataTable({
            "sPaginationType": "full_numbers",
            "bProcessing": true,
            "bServerSide": true,
            "sAjaxSource": source
        });
    });

这样您就不必为每个dataTable创建一个id

Answer 3

您需要精确选择每个表并将适当的Ajax数据源应用于它，以便您获得所需的内容。现在您正在根据班级名称进行选择：

$(".dataTable")

可能需要转换为：

$("#dataTable1")

如果你有很多桌子，我想这会变得乏味，但这几乎是你能做你想做的事情的唯一方法。

Answer 4

您可以在同一页面上使用两个或更多。我已经做到了，数据表工作得非常好。数据表甚至会以异步方式从中删除记录，从而在本地存储数据。因此，当我们搜索已删除的记录时，我们需要始终清楚地显示正确的结果。由于数据表只需初始化一次，我们需要记住，对于同一页面上的每个数据表，我们必须继续初始化数据，因为它们存储本地记录，因为我们不希望这样，因为在同一页面上我们存储/显示不同的数据。

因此。我们必须紧密地使用这种方法

$("#Id_of_Current_DTBL").DataTable().destroy();
$("#Id_of_Other1_DTBL").DataTable().clear();
$("#Id_of_Other2_DTBL").DataTable().clear();

这将解决问题。

具有不同ajax源的同一页面上的多个DataTable

4 个答案: