如何使用 CodeIgniter 中的 AJAX 函数更改网页的数据

Posted 2023-02-24

技术标签:

【中文标题】如何使用 CodeIgniter 中的 AJAX 函数更改网页的数据【英文标题】：How to change data of the webpage using AJAX function in CodeIgninter 【发布时间】：2019-07-25 03:30:38 【问题描述】：

我使用 CodeIgniter 作为我的 Web 框架和控制器，我第一次使用 $this->load->view('Apartments_Hotels', $data 加载数据。但现在我需要在视图中使用 ajax 函数重新加载包含新数据的页面。

视图中的 Ajax 函数

$(document).ready(function() 
    $(".filter_checkbox").click(function()
        var filter = [];
        $.each($("input[name='filter']:checked"), function()
            filter.push($(this).val());
        );
        $.ajax(
            async: false,
            type: 'POST',
            data: 
                filter: filter
            ,
            url: "<?php echo base_url(); ?>index.php/ListingsController/showFilterListings",
            success: function (response) 

            
        );
    );
);

控制器功能

public function showFilterListings()echo $this->load->view('Apartments_Hotels', $data, TRUE);

但这不起作用。谁能帮我使用ajax函数一次又一次地加载视图

【问题讨论】：

在 Chrome 浏览器中调用您的 PHP 页面，并激活 F12（Chrome 开发者工具）。您可以将debugger; 语句添加到“$(document).ready()”，以便更轻松地单步执行浏览器端 JS 代码。 Q：你的 JS 在 Chrome 中看起来还可以吗？我试图提醒响应，它显示了我需要重新加载的整个页面，其中包括所有 html 和 HEAD 标签。但我不知道如何显示该页面 【参考方案1】：

从您的原始帖子中，我不明白什么是“不起作用”。

您已经知道如何显示您的视图（通过调用控制器）。您已经知道如何使用 Ajax（从服务器获取信息），以及如何使用 jQuery（操作浏览器为视图呈现的 DOM）。

问题是您不想刷新整个页面。您当前的 Ajax 调用似乎正是您正在做的事情。

解决办法是：

对于初始显示，让您的 CI 控制器返回一个视图 - 就像您已经在做的那样。

视图将有一个“$(document).ready()”操作处理程序，它将进行 Ajax 调用 - 就像您已经在做的那样。

在视图中添加<div id="xyz"...> 标签，以便从服务器接收“刷新数据”。

您的 Ajax 调用将调用一个 不同的 URL - 一个返回 JSON 数据的 URL - 您想要“刷新”的数据。

您的 Ajax 处理程序将 a) 从响应中解析出 JSON，然后 b) 使用它来更新 DOM 中的 <div>。

这里有一些例子：

Using AJAX to reload only a Div

Let jQuery AJAX Change This Text