• bootstrap table表格前台分页,点击tab选项,重新刷新表格


    近期做项目的时候使用bootstrap表格前台分页,并且有一个tab切换选项,共用一个table,效果如下图,上方是tab选项,下方是table:

    在实际实现的时候,在默认状态下,表格翻到了第5页,此时我要按年龄进行筛选,刚开始我的做法是直接$("#table").bootstrapTable('refresh',option);option里边是一个筛选的条件,这样的效果是页面会展示所选条件下第5页的内容,而不是第一页的内容,这就违背了项目的需求,后来经过搜索、探讨找到了一种解决方案就是重新tab筛选的时候,需要先销毁表格,然后重新初始化:$("#table").bootstrapTable('destroy');先要将table销毁,否则会保留上次加载的内容,initTable(options);重新初使化表格,option为tab来回切换时的筛选条件,这样一来解决了tab切换时出现的问题,表格前台分页是这样,后台分页也是这样。希望对大家有所帮助,描述不清楚的、或者不理解的请留言!

    补充:

    以上是一个最直接的解决方案,后来在项目中发现还有另外两种解决方案:

    $("#table").bootstrapTable('refresh',{url : path );

    $("#table").bootstrapTable('refreshOptions',{pageNumber : 1});

    这两种方式都可以实现。

    refresh:从server端重新获取数据。

    refreshOptions:更新bootstrapTable options,并从server端获取数据。与refresh的区别在于,refreshOptions设置的option,会被作为下次请求server数据的默认option使用。

  • 相关阅读:
    java对象的四种引用
    linux安装python3
    ORACLE配置重做日志文件
    oracle添加控制文件,ORA-00214: 错误
    oracle new 和old 关键字
    with open
    json库
    requests
    urllib模块
    python读取txt天气数据并使用matplotlib模块绘图
  • 原文地址:https://www.cnblogs.com/web-panpan/p/7278367.html
Copyright © 2020-2023  润新知