Datatable服务端处理关联表时如何正确使用筛选功能

问题核心原因 #

你遇到的问题分为JS代码错误和服务端逻辑不匹配两类：

• JS代码存在语法和列索引匹配错误
• 服务端默认搜索逻辑不支持关联表字段的匹配查询

第一步：修复前端JS代码 #

你现有JS首先是选择器缺失#导致拿不到输入框的值，其次列索引完全匹配错误：你要筛选的用户名列对应$columns数组的第二个元素，Datatable列索引从0计数为1，你当前写的是搜索索引为0的日期列，自然不会对用户名列生效。

修正后的代码：

$("#col1_filter").keyup(function() {
    var value = $("#col1_filter").val();
    // 针对索引为1的用户名列做搜索
    if (table.column(1).search() !== value) {
        table.column(1).search(value).draw();
    }
});

第二步：修复服务端搜索逻辑 #

你当前用户名列的db字段绑定的是主表的user_id数字字段，Datatable服务端默认只会搜索绑定的db字段，你输入的用户名字符串无法匹配数字id，自然筛选无效。同时原来的formatter写法每行单独查询用户表，存在N+1性能问题，建议直接用关联查询处理：

1. 调整服务端查询逻辑，给主表加用户表的左关联
2. 修改列配置，直接绑定关联表的name字段作为该列的db字段，不需要在formatter里单独查库

示例PHP代码：

// 示例主表为log，关联users表，按需替换为你的实际表名
$joinQuery = "FROM log l LEFT JOIN users u ON l.user_id = u.id";
$columns = array(
    array('db' => 'l.date', 'dt' => 'td_date'),
    array(
        'db' => 'u.name',  'dt' => 'td_username',
        'formatter' => fn($d) => $d
    ),
    array('db' => 'l.event',   'dt' => 'td_event'),
    array('db' => 'l.plant_UID', 'dt' => 'td_UID_text'),
    array('db' => 'l.note', 'dt' => 'td_note')
);
// 后续调用Datatable服务端处理类时传入关联查询语句即可，用官方ssp类的话可以用complex方法支持自定义join

如果不想改关联查询，也可以自定义服务端的搜索逻辑，当检测到第1列有搜索值时，手动加where条件：user_id IN (SELECT id FROM users WHERE name LIKE "%{$searchVal}%")，注意做参数过滤避免SQL注入。

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