DataTables的SearchBuilder扩展开启回车搜索后新增过滤条件原有值丢失问题

问题原因 #

全局配置的search: {return: true}仅作用于DataTables默认的全局搜索框，不会影响SearchBuilder扩展的默认行为。SearchBuilder默认只要过滤条件发生变更（包括新增条件、修改条件字段/运算符）就会自动触发表格重绘，而服务端处理模式下重绘会重新加载SearchBuilder组件状态，未提交的临时输入值就会被清空。

解决方法 #

给SearchBuilder单独配置回车触发搜索规则，禁用条件变更自动重绘即可：

• 在DataTables初始化配置中新增searchBuilder配置项，开启returnSearch: true，同时可设置redrawOnChange: false明确禁止条件变更时自动重绘
• 原有全局search: {return: true}配置保留，不影响全局搜索框的使用逻辑

修改后的代码示例：

$table = $(`#${_options.table.id}`).DataTable({
        dom: 'Blfrtip',
        search: {
            return: true
        },
        // 新增SearchBuilder专属配置
        searchBuilder: {
            returnSearch: true,
            redrawOnChange: false
        },
        "processing": true, // for show progress bar
        "serverSide": true,
        // 其余原有配置全部保持不变
        // ...
})

配置完成后，新增过滤条件时不会自动触发搜索重绘，已填写的条件值会保留，所有条件填写完成后按回车键才会触发服务端搜索请求。

内容的提问来源于stack exchange，提问作者nguyen