bootstrapTable 的 refresh 带参数方法使用简单举例

最新推荐文章于 2024-04-11 11:51:27 发布

蔡小波

最新推荐文章于 2024-04-11 11:51:27 发布

阅读量1.3w

点赞数 1

分类专栏： Bootstrap 文章标签： bootstrap bootstrapTable refresh

本文链接：https://blog.csdn.net/qq_22078107/article/details/86267654

版权

Bootstrap 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

本文就bootstrapTable refresh 方法带传递参数做简单举例说明。

下面代码中，一个table，一个button，单击button会触发刷新表格操作。

<!DOCTYPE html> <html lang="en">
<head>
<meta charset="utf-8">

<link rel="stylesheet" href="../libs/bootstrap-table-v1.11.0/bootstrap.min.css">
<link rel="stylesheet" href="../libs/bootstrap-table-v1.11.0/bootstrap-table.css">


<script src="../libs/jQuery/jquery-1.8.3.min.js"></script>
<script src="../libs/bootstrap-table-v1.11.0/bootstrap.min.js"></script>
<script src="../libs/bootstrap-table-v1.11.0/bootstrap-table.js"></script>
<script src="../libs/bootstrap-table-v1.11.0/bootstrap-table-zh-CN.js"></script>

</head>

<body>

<table id="item_table"></table>
<button id=refresh_button type="button">刷新</button>

<script>

$('#item_table').bootstrapTable({
    url: "http://local/data/?format=abc",
    columns: [{
        field: 'id',
        title: 'Item ID'
    }, {
        field: 'name',
        title: 'Item Name'
    }, {
        field: 'price',
        title: 'Item Price'
    }],
    data: [{
        id: 1,
        name: 'Item 1',
        price: '$1'
    }, {
        id: 2,
        name: 'Item 2',
        price: '$2'
    }]
});


$("#refresh_button").click(function (){

    var opt = {
        url: "http://local/data/?format=json",
        silent: true,
        query:{
            type:1,
            level:2
        }
    };
    //带参数 刷新
    $("#item_table").bootstrapTable('refresh', opt);

      //不带参数，仅刷新
//    $("#item_table").bootstrapTable('refresh');
});

</script>

</body>
</html>