Bootstrap table set total rows by server

Question

I use bootstrap table to present my data. I use dataSide pagination by server. There is my table header HTML code

<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">

I send AJAX request to my server with informationa about paging, sorting etc. It works. Server returns response with data (contains only visible records) and information about all rows quantity.

There is my JS code, after ajax success. I set total rows, but bootstrap takes value from table header (before changes, for example I get from server totalRows = 7, but bootstrap use data-total-row equals 50)

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

What do I wrong? I can not find any tutarial with good example.

Answer 1

I resolve this problem by add my ajax url to 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/....'