PHP项目中DevExtreme Ajax服务端脚本使用问题及需求咨询

一、先解决排序/过滤报错问题 #

排序、过滤失效或报错的核心原因通常是以下几点，先排查修复：

• 确保数据库表存在主键字段（如ID），初始化DbSet时显式指定主键：

  $this->dbSet = new DbSet($mySQL, "tableName", "ID");
  

• 前端dxDataGrid的列dataField需与数据库字段完全匹配（注意大小写一致性）。
• 确认LoadHelper.php路径正确，DevExtreme-PHP-Data模块加载无异常。

二、在DataController中添加额外WHERE语句 #

提供两种灵活的实现方式：

方法1：全局固定过滤条件 #

在Get方法中直接给DbSet添加WHERE约束，比如只返回Category为Category_1的记录：

public function Get($params) {
    // 添加自定义WHERE条件，支持参数绑定防止SQL注入
    $this->dbSet->Where("Category = ?", ["Category_1"]);
    $result = DataSourceLoader::Load($this->dbSet, $params);
    if (!isset($result)) {
        $result = $this->dbSet->GetLastError();
    }
    return $result;
}

方法2：动态合并前端与自定义过滤条件 #

如果需要同时保留前端dxDataGrid的过滤功能，可合并前端传递的filter参数与自定义条件：

public function Get($params) {
    // 自定义过滤规则
    $customFilter = ["Category", "=", "Category_1"];
    
    // 合并前端过滤条件与自定义条件
    if(isset($params["filter"])){
        $params["filter"] = ["and", $params["filter"], $customFilter];
    } else {
        $params["filter"] = $customFilter;
    }
    
    $result = DataSourceLoader::Load($this->dbSet, $params);
    if (!isset($result)) {
        $result = $this->dbSet->GetLastError();
    }
    return $result;
}

三、完整数据更新（增删改）示例 #

需配合后端Ajax处理页面与前端dxDataGrid配置实现完整CRUD：

1. 后端Ajax处理页面（data.php） #

创建用于接收前端请求的分发页面，将请求转发到DataController对应方法：

<?php
require_once("DataController.php");

header("Content-Type: application/json");
$controller = new DataController();

// 修复原DataController中的拼写错误：Exeption → Exception
// 可提前在DataController中修正该错误，避免报错

switch($_SERVER["REQUEST_METHOD"]){
    case "GET":
        // 初始化测试数据（仅首次调用时执行）
        $controller->FillDbIfEmpty();
        $params = $_GET;
        $result = $controller->Get($params);
        echo json_encode($result);
        break;
    case "POST":
        $values = json_decode(file_get_contents("php://input"), true);
        $result = $controller->Post($values);
        echo json_encode($result);
        break;
    case "PUT":
        $data = json_decode(file_get_contents("php://input"), true);
        $result = $controller->Put($data["key"], $data["values"]);
        echo json_encode($result);
        break;
    case "DELETE":
        $key = json_decode(file_get_contents("php://input"), true);
        $result = $controller->Delete($key);
        echo json_encode($result);
        break;
    default:
        http_response_code(405);
        echo json_encode(["error" => "Method not allowed"]);
}
?>

2. 前端dxDataGrid配置示例 #

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>DevExtreme DataGrid PHP CRUD</title>
    <link rel="stylesheet" href="https://cdn3.devexpress.com/jslib/latest/css/dx.light.css">
    <script src="https://cdn3.devexpress.com/jslib/latest/js/jquery.min.js"></script>
    <script src="https://cdn3.devexpress.com/jslib/latest/js/dx.all.js"></script>
</head>
<body>
    <div id="dataGrid"></div>
    <script>
        $(function(){
            $("#dataGrid").dxDataGrid({
                dataSource: {
                    store: new DevExpress.data.CustomStore({
                        key: "ID",
                        // 加载数据
                        load: function(loadOptions){
                            return $.getJSON("data.php", loadOptions);
                        },
                        // 新增数据
                        insert: function(values){
                            return $.ajax({
                                url: "data.php",
                                method: "POST",
                                contentType: "application/json",
                                data: JSON.stringify(values)
                            });
                        },
                        // 更新数据
                        update: function(key, values){
                            return $.ajax({
                                url: "data.php",
                                method: "PUT",
                                contentType: "application/json",
                                data: JSON.stringify({key: key, values: values})
                            });
                        },
                        // 删除数据
                        remove: function(key){
                            return $.ajax({
                                url: "data.php",
                                method: "DELETE",
                                contentType: "application/json",
                                data: JSON.stringify(key)
                            });
                        }
                    })
                },
                editing: {
                    mode: "row",
                    allowAdding: true,
                    allowUpdating: true,
                    allowDeleting: true
                },
                columns: [
                    {dataField: "ID", allowEditing: false},
                    {dataField: "Name"},
                    {dataField: "Category"},
                    {dataField: "CustomerName"},
                    {dataField: "BDate", dataType: "date"}
                ],
                remoteOperations: true, // 开启服务端排序、过滤、分页
                sorting: {mode: "multiple"},
                filtering: {mode: "row"}
            });
        });
    </script>
</body>
</html>

额外注意事项 #

• 确保PHP开启mysqli扩展，数据库连接信息（服务器、用户名、密码、库名）正确。
• 跨域场景下，需在data.php添加跨域头：header("Access-Control-Allow-Origin: 你的前端域名");（生产环境禁用通配符*）。

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