Question

我使用bootstrap表来显示我的数据。我使用服务器的dataSide分页。有我的表头HTML代码

<table id="shipmentsListTable" class="table table-striped"
 data-toggle="table"
 data-cache="false" data-search="true"
 data-side-pagination="server"
 data-total-rows="50"
 data-sort-name="CreatedDate"
 data-sort-order="desc"
 data-pagination="true"
 data-page-size="10"
 data-page-number="1">

我向我的服务器发送AJAX请求，其中包含有关分页，排序等的信息。服务器返回带有数据的响应（仅包含可见记录）和有关所有行数量的信息。

在ajax成功之后，有我的JS代码。我设置了总行数，但bootstrap从表头获取值（在更改之前，例如我从服务器totalRows = 7获取，但bootstrap使用data-total-row等于50）

        $("#shipmentsListTable").attr("data-total-rows", shipmentsListJson.TotalCount);
        $("#shipmentsListTable").bootstrapTable("load", shipmentsListJson.Rows);

我错了什么？我找不到任何有良好榜样的tutarial。

Answer 1

我通过将我的ajax网址添加到attibiute“data-url”来解决此问题

<table id="shipmentsListTable" class="table table-striped"
 data-toggle="table"
 data-cache="false" data-search="true"
 data-side-pagination="server"
 data-total-rows="50"
 data-url='myPage/....'

Answer 2

您可能需要在ajax成功回调中生成表节点。像这样：

<div id="tableTarget"></div>

$.ajax(function () {...
}).success(function () {
    var rows = shipmentsListJson.Rows;
    $('#tableTarget').html('<table id="shipmentsListTable" class="table table-striped"
                           data-toggle="table"
                           data-cache="false" data-search="true"
                           data-side-pagination="server"
                           data-total-rows="' + rows + '"
                           data-sort-name="CreatedDate"
                           data-sort-order="desc"
                           data-pagination="true"
                           data-page-size="10"
                           data-page-number="1">');
});

Bootstrap表按服务器设置总行数

2 个答案: