with the Bootstrap Table plugin, how to set a search string on first load?

问题

With the Bootstrap Table plugin (http://bootstrap-table.wenzhixin.net.cn/documentation/) how to set a search string when the table is loaded for the first time?

Exists only a "data-search" attribute to enable the search input, but this doesn't valorize it.

I looked for a "data-search-text" attribute but I've not found it.

回答1:

There isn't support for data attribute but only via JavaScript

bootstrapTable({
    formatSearch: function () {
        return 'search string';
    }
});

回答2:

A better solution is this one:

var srch_str = 'your search string';
var bstable_first_load = true;
table.on('post-body.bs.table', function () {//when the table is loaded the first time and visible in the DOM, set the search string...
    if(srch_str.length > 0 && bstable_first_load){$('.fixed-table-toolbar').find('.search > :input').val(srch_str);bstable_first_load = false};
});

回答3:

I needed such a behavior too. My first attempts were to use bootstrapTable('resetSearch', 'my-query') with a fixed timeout; sadly this was yielding two requests (and additional reflows if the first query made it to the client) so it was sub-optimal.

After a while I found that the goal can be achieved modifying query params wisely (i.e. for the first request only):

var start_query = '20';

$('#table').bootstrapTable({
     queryParams: function(params){
        if(start_query){
            $('.bootstrap-table').find('.search input').val(start_query)
            params['search'] = start_query
            start_query = null
        }
        return params
    }
});

Interestingly the $input.val() call does not fire any additional callbacks so the code above uses only one query/request.

Please see a working demo here: http://jsfiddle.net/e3nk137y/15364/

Edit: The preferred way to do implement such behavior probably should use searchText option; sadly it also issues two requests. I created an issue in bootstrap-table repo.

Edit 2: A patch for two-request behaviour of searchText has been merged into the development branch of the Bootstrap Table plugin and should be a part of the next release.

来源：https://stackoverflow.com/questions/28028857/with-the-bootstrap-table-plugin-how-to-set-a-search-string-on-first-load

标签

javascript

jquery

twitter-bootstrap

bootstrap-table