Method of setting timeout of timeout when BootstrapTable requests data

When using bootstrapTable to obtain data, sometimes due to network or server reasons, data cannot be obtained in time, and the page shows that 1 is in a waiting state. In order to improve the effect, consider setting timeout. When the request is sent, no data will be displayed after timeout, and the request will be re-initiated after a period of time.

In implementation, bootstrapTable obtains data through ajax, and one attribute of ajax can be set by using ajaxOptions option.

bootstrapTable to set timeout, first set the async property to true, and in bootstrapTable, async defaults to false. For example

$("#event_table").bootstrapTable({
 url: urlAddr,
 ajaxOptions: {async:true,timeout:5000},
});

In addition, using refresh method to add ajaxOptions has no effect:

$( " #event_table " ).bootstrapTable('refresh', {
  url: api_url,
  ajaxOptions:{async:true,timeout:1000}
});

The reason needs to be further studied.

Let's look at how to know if table data was successfully loaded when using bootstrapTable to obtain data.

bootstrapTable provides a specialized loadsuccess method to reflect whether the data was loaded successfully.

$table.on('load-success.bs.table',function(data){
  console.log("load success");
 });

For bootstrapTable usage documentation, please refer to http://bootstrap-table.wenzhixin.net.cn/documentation/

Reference:

Analysis on the Difference between refresh and refreshOptions of boostrapTable