使用 AJAX 将数据传递到 Controller 并从数据库获取数据的教程

胖宇同学_8724

发布时间：2025-10-04 11:47:01

464人浏览过

来源于php中文网

原创

使用 ajax 将数据传递到 controller 并从数据库获取数据的教程

本文档旨在指导开发者如何通过 AJAX 将数据从前端传递到后端 Controller，并利用这些数据从数据库中检索所需信息。我们将详细讲解前端 AJAX 请求的构建、后端 Controller 数据的接收与处理，以及 Model 层的数据查询。通过本文，你将掌握前后端数据交互的关键步骤，并能解决数据传递过程中可能遇到的问题。

前端 AJAX 请求的构建

首先，我们需要在前端构建一个 AJAX 请求，将需要传递的数据发送到后端的 Controller。以下是一个使用 jQuery 的 AJAX 方法的示例：

$(document).ready(function() {
    $('#csubmit1').on('click', function(event) {
        event.preventDefault();

        // 获取表单数据
        var formData = {
            orderfrom1: $("#orderfrom1").val(),
            orderto1: $("#orderto1").val(),
            agentlist1: $("#ag1").val()
        };

        console.log(formData);

        // 发送 AJAX 请求
        $.ajax({
            type: "POST",
            url: "<?php echo base_url(); ?>home/obwirelessreports",
            data: formData,
            success: function(data) {
                $('#search_change1').html(data);
            },
            error: function(jqXHR, textStatus, errorThrown) {
                console.error("AJAX Error:", textStatus, errorThrown);
            }
        });
    });
});

代码解释：

Web Accessibility (WCAG 2 AA))

将 WCAG 2 AA 无障碍标准应用于设计系统、UI 组件和网页——通过可运行的验证器进行对比度计算，采用设计 token 模式使颜色天生可访问，设定排版和焦点状态规则，并提供语义检查清单。适用于构建或审查 UI。

下载

$(document).ready(function() { ... });：确保页面加载完成后执行代码。
$('#csubmit1').on('click', function(event) { ... });：为 ID 为 csubmit1 的元素绑定点击事件。
event.preventDefault();：阻止表单的默认提交行为。
var formData = { ... };：创建一个包含要传递数据的对象。注意，这里的键名（例如 orderfrom1）非常重要，需要与后端 Controller 接收数据的键名保持一致。
$.ajax({ ... });：发送 AJAX 请求。
- type: "POST"：指定请求类型为 POST。
- url: "<?php echo base_url(); ?>home/obwirelessreports"：指定请求的 URL，即后端 Controller 的地址。
- data: formData：指定要发送的数据。
- success: function(data) { ... }：指定请求成功后的回调函数，用于处理后端返回的数据。
- error: function(jqXHR, textStatus, errorThrown) { ... }：指定请求失败后的回调函数，用于处理错误信息。

注意事项：

确保 jQuery 库已正确引入。
base_url() 函数是 CodeIgniter 框架提供的，用于获取网站的根 URL。如果使用其他框架，需要使用相应的函数或方法获取 URL。
建议添加 error 回调函数，以便在请求失败时能够及时发现问题。

后端 Controller 数据的接收与处理

接下来，我们需要在后端的 Controller 中接收并处理 AJAX 请求发送的数据。以下是一个示例：

<?php
defined('BASEPATH') OR exit('No direct script access allowed');

class Home extends CI_Controller {

    public function obwirelessreports() {
        $details = $this->input->post();

        // 确保键名与前端发送的键名一致
        $data["orderfrom1"] = date("Y-m-d", strtotime($details['orderfrom1']));
        $data["orderto1"] = date("Y-m-d", strtotime($details['orderto1']));
        $data["agentlist1"] = $this->Maindata->wiresearch1($details);

        // 将数据传递给视图
        $this->load->view('your_view', $data);
    }
}

代码解释：

$details = $this->input->post();：获取通过 POST 方法传递的数据。
$data["orderfrom1"] = date("Y-m-d", strtotime($details['orderfrom1']));：从 $details 数组中获取 orderfrom1 的值，并将其转换为 Y-m-d 格式的日期。注意，这里 $details['orderfrom1'] 的键名必须与前端 AJAX 请求中 formData 对象的键名一致。
$data["agentlist1"] = $this->Maindata->wiresearch1($details);：调用 Model 层的 wiresearch1 方法，并将 $details 数组作为参数传递。
$this->load->view('your_view', $data);：将处理后的数据传递给视图进行渲染。

注意事项：

确保 $this->input->post() 方法能够正确获取 POST 数据。这取决于你使用的框架或库。
在访问 $details 数组中的元素时，务必确保键名与前端发送的键名一致。这是最常见的问题之一。
对接收到的数据进行必要的验证和清理，以防止安全漏洞。

Model 层的数据查询

最后，我们需要在 Model 层根据接收到的数据进行数据库查询。以下是一个示例：

<?php
class Maindata extends CI_Model {

    public function wiresearch1($data2) {
        // 确保键名与 Controller 传递的键名一致
        $orderfrom = date("Y-m-d", strtotime($data2['orderfrom1']));
        $orderto = date("Y-m-d", strtotime($data2['orderto1']));
        $agent_list = implode(', ', array_map(function($val){return sprintf("'%s'", $val);}, $data2["agentlist1"]));

        // 构建 SQL 查询语句
        $sql = "SELECT * FROM your_table WHERE order_date BETWEEN '$orderfrom' AND '$orderto' AND agent_id IN ($agent_list)";

        // 执行查询
        $query = $this->db->query($sql);

        // 返回结果
        return $query->result_array();
    }
}

代码解释：

$orderfrom = date("Y-m-d", strtotime($data2['orderfrom1']));：从 $data2 数组中获取 orderfrom1 的值，并将其转换为 Y-m-d 格式的日期。注意，这里 $data2['orderfrom1'] 的键名必须与 Controller 传递的 $details 数组中的键名一致。
$agent_list = implode(', ', array_map(function($val){return sprintf("'%s'", $val);}, $data2["agentlist1"]));：将 $data2["agentlist1"] 数组中的元素转换为字符串，并用逗号分隔。
$sql = "SELECT * FROM your_table WHERE order_date BETWEEN '$orderfrom' AND '$orderto' AND agent_id IN ($agent_list)";：构建 SQL 查询语句。
$query = $this->db->query($sql);：执行 SQL 查询。
return $query->result_array();：返回查询结果。

注意事项：