FastAdmin 设置默认TAB选项卡

最新推荐文章于 2025-06-19 11:38:23 发布

原创最新推荐文章于 2025-06-19 11:38:23 发布 · 955 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#前端 #javascript

FastAdmin 专栏收录该内容

11 篇文章

订阅专栏

本文介绍了在网页中使用两种方法实现动态表格的导航切换和数据筛选功能，主要关注Bootstrap框架下的tab组件及post-common-search事件的应用。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

方法一

<div class="panel-heading">
   {:build_heading(null,FALSE)}
   <ul class="nav nav-tabs" data-field="status">
       {foreach name="statusList" item="vo"}
       {if condition="$key neq  1"}
       <li class="active"><a href="#t-{$key}"  data-value="{$key}" data-toggle="tab">{$key}</a></li>
       {else}
       <li><a href="#t-{$key}"  data-value="{$key}" data-toggle="tab">{$key}</a></li>
       {/if}
       {/foreach}
       <li><a href="#t-all" data-value="" data-toggle="tab">{:__('All')}</a></li>
   </ul>
</div>

方法二

var table = $("#table");

table.on('post-common-search.bs.table', function (event, table) {
     var form = $("form", table.$commonsearch);
     // tab设置
     $('ul.nav-tabs li a[data-value="1"]').trigger('click');
     $(".form-commonsearch select[name=status]").val("1");
 });

 // 初始化表格
 table.bootstrapTable({})