Search code examples
bootstrap-table

Append records to existing bootstrap table by wenzhixin


What I did

On page load we loaded 100 records (per page 10 records).

<table id="all" class="table table-hover table-condensed" 
               data-toggle="table"
               data-toolbar="#toolbar"
               data-url="/retrieveusers"
               data-search="true"
               data-multiple-search = "true"
               data-trim-on-search="false"
               data-show-export="true"
               data-pagination="true"
               data-maintain-selected="true"
               data-method="post"
               data-query-params="postQueryParams"
               data-page-size="10"
               data-page-list="[10,20,30,50,75,100,200,250,500]">

Actual Problem

When we reach 10th page i.e. 100th record, we want to append next 100 records to the existing table.

Please suggest me a solution for this problem.


Solution

  • There is 'append' method available in documentation. Example is here http://issues.wenzhixin.net.cn/bootstrap-table/#methods/append.html You may catch 'onPageChange' event and then load next portion of your data and append it to the table.