1

我试图通过 twitter bootstrap 集成的优秀的footable插件没有初始化。也就是说，感谢我的萤火虫检查员，我可以看到表格是由 footable 插件处理的，但我总是想隐藏的行：

data-hide="all"

可见。如果我更改浏览器的大小，则该表具有我期望它在页面启动时应该具有的行为。

我在 firefox/chrome 和不同的 jQuery 版本中尝试过，但还是一样！

我举了一个最简单的例子来看看发生了什么，但没有更多的运气！据说footable正在与开箱即用的引导程序一起工作。

我正在使用 requireJS 在我的页面上加载大量脚本，但没有出现错误。我不明白footable是如何识别表格的，但它的属性没有激活！

感谢您的任何调查方式！

编辑：我知道问题出在我的表在页面加载时隐藏的 div 中（使用引导向导），所以添加：

onTabShow: function(tab, navigation, index) {
if(index===3){
        $('.footable').trigger('footable_initialize');
}

}

成功了:)

4

3 回答 3

5

这是因为fooTable当它处于隐藏状态时无法分辨屏幕的大小div/tab。

使用以下 jQuery：

$(document).ready(function() { 
    $('.nav-tabs a').click(function (e) {
        //prevents re-size from happening before tab shown
        e.preventDefault();
        //show tab panel
        $(this).tab('show');  
        //fire re-size of footable
        $('.footable').trigger('footable_resize'); 
    });
});
于 2014-02-17T21:12:56.433 回答
1

You did answer your own question with regards to using the bootstrap wizard. The original question concerns footable. I struggled with it a little, but the solution is simple using the shown.bs.tab event.

Use the following jQuery:

    $('.nav-tabs a').click(function (e) {
        e.preventDefault();
        $(this).tab('show');
    });

    $(function () {
        $('.footable').footable();
    });

    $("ul.nav-tabs > li > a").on("shown.bs.tab", function (e) {
        //fire initialize of footable because the footable plugin only processes tables that are visible
        $('.footable').trigger('footable_initialize');
    });
于 2014-06-14T07:36:39.800 回答
0

你是在自问自答。footable 插件只处理可见的表格。检查footable.js resize()方法中的代码

 if (!$table.is(':visible')) {
    return;
 } //we only care about FooTables that are visible

所以你是对的。要么确保选项卡完全可见，并且所有父级都可见，要么触发导致 footable 重置表的初始化事件。但也许最好重新初始化刚刚显示的表。

$('#myFooTable').trigger('footable_initialize');
于 2013-10-29T05:02:20.470 回答