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

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
        });
    });

这样你就不必为每个数据表创建一个 id