数据表 + jquery UI 按钮答案

【问题标题】：Datatable + jquery UI button数据表 + jquery UI 按钮
【发布时间】：2012-04-27 18:11:27
【问题描述】：

我正在使用数据表（如在 Datatables.net 中）并自己对其进行格式化。为了使分页按钮看起来不错，我正在这样做：

$(function(){
    $('#data').dataTable({
        "fnDrawCallback" : function() {
            $('#data_next').button();
            $('#data_previous').button();
        }           
    });
} );

问题是，虽然 fnDrawCallback 事件在页面更改时被触发，但 .button() 调用似乎是在 Datatable 完成 DOM 之前发生的。看起来内部仍然有 Button 类，但它本身已将它们删除。

我认为 fnDrawCallback 发生在 Datatable 完成绘图之后，但显然不是。

建议？

【问题讨论】：

每次有分页事件时都会调用它吗？
我还没有机会尝试，但你可以试试
对不起，当您更改页面时它不会触发，但您可能只需将 JQueryUI 按钮类应用于它们

标签： jquery jquery-ui datatables

【解决方案1】：

你应该阅读文档，你的答案就在那里：

http://datatables.net/styling/custom_classes

要考虑的另一件事是将 DataTable 作为完整的 Jquery UI 集成：

http://datatables.net/examples/basic_init/themes.html

使用此初始化：

$(document).ready(function() {
  oTable = $('#example').dataTable({
    "bJQueryUI": true,
    "sPaginationType": "full_numbers"
  });
});

您只需要设置您喜欢的主题并对 css 进行任何更改即可。

再进一步，看一下 Jquery UI ThemeRoller 支持的 dataTable 演示： http://datatables.net/styling/themes/redmond

【讨论】：