如何使用 jQuery 数据表插件实现这种复杂的搜索？

Posted 2023-05-07

【中文标题】如何使用 jQuery 数据表插件实现这种复杂的搜索？

【英文标题】：How to achieve this complex search using jQuery datatable plugin?

【发布时间】：2017-05-15 17:03:51

【问题描述】：

我正在尝试制作一个可搜索的界面，我的后端包含三个 mysql 数据库表：

tbl_country

mysql> select * from tbl_country;
+--------------+---------------+
| country_code | country       |
+--------------+---------------+
| AFG          | AFGHANISTAN   |
| AUS          | AUSTRALIA     |
| CAN          | CANADA        |
| GBR          | GREAT BRITAIN |
| IND          | INDIA         |
| USA          | USA           |
+--------------+---------------+
6 rows in set (0.00 sec)

tbl_state

mysql> select * from tbl_state;
+----------+------------------+--------------+
| state_id | state            | country_code |
+----------+------------------+--------------+
|        1 | Maharashtra      | IND          |
|        2 | Delhi            | IND          |
|        3 | West Bengali     | IND          |
............
|       51 | Queensland       | AUS          |
+----------+------------------+--------------+
33 rows in set (0.00 sec)

tbl_city

mysql> select * from tbl_city;
+---------+----------+--------------------+
| city_id | state_id | city               |
+---------+----------+--------------------+
|       1 |        1 | Mumbai (Bombay)    |
|       2 |        1 | Nagpur             |
.......
|      84 |       37 | Edinburgh          |
|     122 |       44 | Cardiff            |
|     127 |       46 | Melbourne          |
|     130 |       48 | Perth              |
|     131 |       49 | Adelaide           |
|     132 |       50 | Canberra           |
|     133 |       51 | Brisbane           |
|     134 |       51 | Gold Coast         |
+---------+----------+--------------------+
54 rows in set (0.00 sec)

我有我的 MySQL 数据库架构和值，如SQL Fiddle 中所示

我的搜索需要一个单一的界面，我可以在其中根据任何给定的城市或州的详细信息搜索所有国家/地区。

我正在尝试使用这个查询，它正确地给出了我想要获取的输出：

SELECT 
-- tbl_country
c.country_code, c.country,

-- tbl_state
CAST(GROUP_CONCAT(s.state SEPARATOR ',') AS CHAR) as state,
-- tbl_city
CAST(GROUP_CONCAT(ct.city SEPARATOR ',') AS CHAR) as city

-- tbl_papers
FROM tbl_country c
LEFT JOIN tbl_state s ON s.country_code = c.country_code
LEFT JOIN tbl_city ct ON ct.state_id = s.state_id

GROUP BY (c.country_code);

我正在使用 Datatable 插件，这是一个非常强大且易于使用的插件，但是每当我尝试使用搜索过滤器时，它现在都可以工作，因为数据表的 Server Side php class 尝试创建一个动态查询，其中包含基于绑定的 where 条件列。

查询绑定数据表，如第一行所示，因为没有进行搜索：

动态查询是这样的：

SELECT    sql_calc_found_rows `c`.`country_code`,
          `c`.`country`,
          group_concat(`s`.`state` separator "," ) AS state,
          group_concat(`ct`.`city` separator ",")  AS city
FROM      `tbl_country`                            AS `c`
LEFT JOIN `tbl_state`                              AS `s`
ON        (
                    `s`.`country_code` = `c`.`country_code`)
LEFT JOIN `tbl_city` AS`ct`
ON        `ct`.`state_id` = `s`.`state_id`
WHERE     (
                    `c`.`country_code` LIKE :binding_0
          OR        `c`.`country` LIKE :binding_1
          OR        group_concat(`s`.`state` separator ",") LIKE :binding_2
          OR        group_concat(`ct`.`city` separator ",") LIKE :binding_3)
GROUP BY  `c`.`country_code`
ORDER BY  `c`.`country_code` ASC limit 0,
          10

这显然会给出如下所示的错误：

无论如何，我可以使用 PHP 和数据表插件根据上述场景中给定的城市、州和国家/地区的详细信息进行过滤/搜索。可能我需要更改我的查询结构！

【参考方案1】：

我假设您正在使用 ssp.class.php 在服务器端处理您的数据。

ssp.class.php 类不支持包含 JOIN 和子查询的复杂查询，但有一种解决方法。诀窍是在$table 定义中使用如下所示的子查询。

$table = <<<EOT
 (
    SELECT 
    c.country_code, 
    c.country,
    CAST(GROUP_CONCAT(s.state SEPARATOR ',') AS CHAR) as state,
    CAST(GROUP_CONCAT(ct.city SEPARATOR ',') AS CHAR) as city
    FROM tbl_country c
    LEFT JOIN tbl_state s ON s.country_code = c.country_code
    LEFT JOIN tbl_city ct ON ct.state_id = s.state_id
    GROUP BY (c.country_code)
 ) temp
EOT;

$primaryKey = 'id';

$columns = array(
   array( 'db' => 'country_code', 'dt' => 0 ),
   array( 'db' => 'country', 'dt' => 1 ),
   array( 'db' => 'state', 'dt' => 2 ),
   array( 'db' => 'city', 'dt' => 3 )
);

$sql_details = array(
   'user' => '',
   'pass' => '',
   'db'   => '',
   'host' => ''
);

require( 'ssp.class.php' );
echo json_encode(
   SSP::simple( $_GET, $sql_details, $table, $primaryKey, $columns )
);

您还需要编辑ssp.class.php 并将FROM `$table` 的所有实例替换为FROM $table 以删除反引号。

还有 github.com/emran/ssp 存储库，其中包含增强的 ssp.class.php 支持 JOIN。

链接

更多信息请参见jQuery DataTables: Using WHERE, JOIN and GROUP BY with ssp.class.php。

【讨论】：

有趣的是，我在过去的一个小时内完成了这个精确的解决方案！谢谢@Gyrocode.com :) 新年快乐！

@Milson，我更正了答案中的类型。新年快乐！