bootstrap中两个Tab选项卡切换，刷新页面

最新推荐文章于 2022-02-21 13:41:20 发布

一个被代码耽误的歌手

最新推荐文章于 2022-02-21 13:41:20 发布

阅读量2.2k

点赞数 1

分类专栏： html 文章标签： html jquery

本文链接：https://blog.csdn.net/weixin_43417378/article/details/112566244

版权

html 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

bootstrap中两个Tab选项卡切换，刷新页面

回调数据加入这行代码，就可以实现选项卡切换，刷新页面。 $("#bootstrap-table2").bootstrapTable(‘refresh’,{url : 另一个选项卡查询数据的路径});
bootstrap-table2------第二个选项卡的id。

<div class="tabs-container">
                <ul class="nav nav-tabs">
                    <li class="active"><a data-toggle="tab" href="#tab-1" aria-expanded="true"> 未选择</a>
                    </li>
                    <li class=""><a data-toggle="tab" href="#tab-2" aria-expanded="false" >已选择</a>
                    </li>
                </ul>

                <div class="tab-content">
                    <div id="tab-1" class="tab-pane active">
                        <div class="example-wrap">
                            <div class="example bs-bars">
                                <div class="btn-group-sm">
                                    <a class="btn btn-success" onclick="addCollected()">
                                        <i class="fa fa-plus"></i> 导入
                                    </a>
                                    <a class="btn btn-primary"  th:onclick="back()">
                                        <i class="fa fa-edit"></i> 返回
                                    </a>
                                </div>
                            </div>
                            <table id="bootstrap-table1"></table>
                        </div>
                    </div>
                    <div id="tab-2" class="tab-pane">
                        <table id="bootstrap-table2"></table>
                    </div>
                </div>
            </div>

JS部分：

function addCollected(){
        var rows = $.common.isEmpty(table.options.uniqueId) ? $.table.selectFirstColumns() : $.table.selectColumns(table.options.uniqueId);
        if (rows.length == 0) {
            $.modal.alertWarning("请至少选择一条记录");
            return;
        }
        var ids = rows.join();
        // alert(ids);
        $.ajax({
            type:'post',
            url: path,
            data: {'ids': ids},
            success:function (msg) {
                if(msg!=0){
                    $.modal.msgSuccess("导入成功！");
                    $.table.refresh();
                    $("#bootstrap-table2").bootstrapTable('refresh',{url : 另一个选项卡查询数据的路径});
                }
            }
        });
    }