使用 Bootstrap Table 插件，如何在首次加载时设置搜索字符串？答案

【问题标题】：with the Bootstrap Table plugin, how to set a search string on first load?使用 Bootstrap Table 插件，如何在首次加载时设置搜索字符串？
【发布时间】：2015-03-17 16:59:39
【问题描述】：

使用Bootstrap Table插件（http://bootstrap-table.wenzhixin.net.cn/documentation/）第一次加载表时如何设置搜索字符串？

仅存在一个“data-search”属性来启用搜索输入，但这并不能对其进行评估。

我查找了“数据搜索文本”属性，但没有找到。

【问题讨论】：

为什么不设置值并使用 jquery on load/$(function? 触发事件？
由于插件中的 html 标记硬编码，我无法轻松访问在运行时创建的输入元素。

标签： javascript jquery twitter-bootstrap bootstrap-table

【解决方案1】：

不支持 data 属性，只能通过 JavaScript 实现

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

【讨论】：

此代码仅设置默认输入值，但输入中的任何编辑都将被重置

【解决方案2】：

一个更好的解决方案是这个：

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】：

我也需要这样的行为。我的第一次尝试是使用具有固定超时的bootstrapTable('resetSearch', 'my-query')；遗憾的是，这会产生两个请求（如果第一个查询发送到客户端，还会产生额外的重排），因此它不是最佳的。

一段时间后，我发现可以明智地修改查询参数来实现目标（即仅针对第一个请求）：

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
    }
});

有趣的是，$input.val() 调用不会触发任何额外的回调，所以上面的代码只使用一个查询/请求。

请在此处查看工作演示：http://jsfiddle.net/e3nk137y/15364/

编辑：实现这种行为的首选方法可能应该使用searchText 选项；可悲的是，它也发出了两个请求。我在bootstrap-table repo 中创建了一个问题。

编辑 2：searchText 的两个请求行为的补丁已将 merged 放入 Bootstrap Table 插件的开发分支中，应该是下一个版本的一部分。

【讨论】：

【解决方案4】：

此脚本允许您在第一次加载时过滤表中的数据

<script>
 $('document').ready(function(){
   const table = $('#tableId').DataTable();
   table.search('what_you_looking_for').draw();
 });
</script>

【讨论】：