ajax - CodeIgniter Ajax 表单

ajax - CodeIgniter Ajax 表单 - 提交表单

转载作者：行者123 更新时间：2023-12-04 05:33:00

25

4

我是 stackoverflow 和 CodeIgniter 的新手，我目前正在尝试一些我在 Internet 上找到的简单代码示例，以便开始。我现在正在处理的一个表单使用 CI 和 Ajax (jQuery)，并将表单的输入保存在数据库中，然后在与表单相同的页面上显示它们中的最新输入。
如果我把你弄糊涂了，那是来自 here 的 4.7 应用程序示例.初始源代码位于 here但是我已经修改了它以使用最新版本的 CI，并在下面引用了我所有的 MVC 文件。

Controller :

<?php
class Message extends CI_Controller
{
    function __construct()
    {
        parent::__construct();
        $this->load->helper('form');
        $this->load->helper('url');
        $this->load->helper('security');
        $this->load->model('Message_model');
    }

    function view()
    {
        //get data from database
        $data['messages'] = $this->Message_model->get();

        if ( $this->input->is_ajax_request() ) // load inline view for call from ajax
            $this->load->view('messages_list', $data);
        else // load the default view
            $this->load->view('default', $data);
    }

    //when we pres the submit button from the form
    function add()
    {
        if ($_POST && $_POST['message'] != NULL)
        {
            $message['message'] = $this->security->xss_clean($_POST['message']);
            $this->Message_model->add($message);
        }
        else
        {
            redirect('message/view');
        }
    }
}
?>

型号:

<?php
class Message_model extends CI_Model
{
    function __construct()
    {
        parent::__construct();
        $this->load->database();
    }

    function add($data)
    {
        $this->db->insert('messages', $data);
    }

    function get($limit=5, $offset=0)
    {
        $this->db->order_by('id', 'DESC');
        $this->db->limit($limit, $offset);

        return $this->db->get('messages')->result();
    }
}
?>

浏览量

默认.php:

<!-- called using message/view -->
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

        <script src="<?php echo base_url('js/jquery-1.8.1.min.js'); ?>" type="text/javascript"></script>
        <script type="text/javascript">
            $(document).ready(function()
            {
                $('#submit').click(function(e)
                {
                    e.preventDefault();
                    var msg = $('#message').val();
                    $.post("", {message: msg}, function() {
                        $('#content').load("");
                        $('#message').val('');
                    });
                });
            });
        </script>
    </head>

    <body>
        <?php echo form_open("message/add"); ?>
        <input type="text" name="message" id="message">
        <input type="submit" value="submit" name="submit" id="submit">
        <?php echo form_close(); ?>

        <div id="content"></div>
    </body>
</html>

消息列表.php:

<!-- called from ajax call -->

<ol>
<?php foreach ($messages as $cur): ?>
    <li><?php echo $cur->message; ?></li>
<?php endforeach; ?>
</ol>

问题主要在于第一个 View (default.php)。也就是说，如果我省略 e.preventDefault(); javascript 代码中的一行，然后表单加载一个不同的页面(消息/添加如表单操作参数所暗示的)，这是一个空白页面，也以这种方式取消了我的应用程序的 ajax 行为。
另一方面，如果我真的添加了这一行，则不会调用我的消息 Controller 的 add 方法，因此不会将我输入的内容添加到数据库中。

最后，我尝试了以下 js 代码，而不是上面的其他代码:

$(document).ready(function()
            {
                $('#submit').click(function(e)
                {
                    e.preventDefault();
                    var msg = $('#message').val();
                    $.post("<?php echo base_url(); ?>message/add", {message: msg}, function() {
                        $('#content').load("");
                        $('#message').val('');
                    });
                });
            });

但这样看来 $.post() 崩溃了，因为在应该在成功的 post() 调用上运行的函数中没有执行任何操作。

任何帮助都对这篇大文章表示赞赏和抱歉。 :)

最佳答案

您是正确的，您必须调用 e.PreventDefault(); ，但您还必须处理来自回调函数的响应，而您不是。回调接受一些参数，但第一个是您感兴趣的，它是来自您的服务器的响应。我将其表示为 r以下:

$(document).ready(function(){
    $('#submit').click(function(e){
        e.preventDefault();
        var msg = $('#message').val();
        $.post("<?php echo base_url(); ?>message/add", {message: msg}, function(r) {
            //do something with r... log it for example.
            console.log(r);
        });
    });
});

我还删除了 $.("#content").load(...); .当第一个请求完成时，这实际上会执行另一个 AJAX 请求。

现在，检查您的 Controller ...请不要使用 $_POST。 CodeIgniter 为您提供 $this->input->post()作为 Input Library 的一部分.如果在 config/config.php 中打开全局 XSS 过滤你也不必 xss 清理它。您可以使用 $this->input->post('name', true); 逐个进行清理。

我推荐这个:

function add(){
    $m = $this->input->post('message', true);
    if($m){
        $this->Message_model->add($m);
    }
}

关于ajax - CodeIgniter Ajax 表单 - 提交表单，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/12352404/

25

4

0

文章推荐： shell - 用shell删除最旧的文件

文章推荐： php - 如何使用相关实体独立设置 Symfony2 Bundle

文章推荐： php - 将自定义数据库表添加到 wordpress 搜索

codeigniter - CodeIgniter 中的自定义异常
我想扩展调用 getMessage 时返回自定义消息的异常类。 class MY_Exceptions extends CI_Exceptions{ function __construct
codeigniter - CodeIgniter 的重写器不起作用
我已经安装了一个干净的 Apache2(加上 PHP 和 MySQL)服务器并启用了 mod_rewrite在 apache 配置中。我添加了 .htaccess文件以从 url 中删除 index
codeigniter - CodeIgniter 中站点的根路径
我正在使用上传类上传图片。但是我上传的图片的存储位置是:http://www.mysite.com/uploads/ 此文件夹的绝对路径是:c:\wamp\www\mysite\uploads\ 应用
codeigniter - Codeigniter:如何在Codeigniter上下文中提供静态HTML页面
大家好我想在codeigniter上下文中提供一些静态html页面。我不想绕过base_url中的index.php文件。但是，当我使用对HTML文件的调用时，它不会显示404错误页面。感谢已经
codeigniter - Codeigniter 模型中的面向对象方法
我一直想知道在模型中以 OO 风格编写代码的正确方法是什么。当然，您可以拥有一个从数据库中检索数据然后映射到模型级变量的函数。但是，当您在模型中有其他功能试图从 BD 获取其他数据时，这种方法会变得违
codeigniter - CodeIgniter 中的多对多联接查询
之前所有的 JOIN 尝试都给我留下了填充结果的 id、标题键的光盘或项目数据(可能发生了冲突)。所以我有: item table fields: id, title disc table fiel
codeigniter - 处理无效参数的最佳实践 CodeIgniter
假设我在 Controller 中有一个名为的方法 book($chapter,$page); 其中 $chapter 和 $page 必须是整数。要访问该方法，URI 将如下所示 book/cha
codeigniter - codeigniter 中的上传大小限制
我有一个用户可以注册的页面。他在此过程中上传了个人资料照片。我想限制大小，但除了 $config['maxsize'] 之外，并没有太多强调 codeigniter 文档。我尝试了以下但我没有收到任何
codeigniter - 如何为真正的多语言网站设置 CodeIgniter？
我需要将 CodeIgniter 设置为真正的多语言网站。我已经搜索过，但找不到解决方案。我已经测试了这种方法，但它不起作用。 ( http://codeigniter.com/wiki/Categ
codeigniter - 常量和 CodeIgniter
CodeIgniter 中的常量是否可以用于整个站点中的重复文本(比如元标记和元描述)？就像是: define('METADESCRIPTION', 'This is my site'); 然后将 M
codeigniter - CodeIgniter 中不区分大小写的路由
我已经在 CodeIgniter 的路由器中写了这个。 $route['companyname'] = "/profile/1"; 这工作正常，但是当我在 URL 中键入“公司名称”时，它不起作用。这
codeigniter - CodeIgniter 的正确命名结构
我正在开始我的第一个 CodeIgniter 项目，并希望在开始之前获得一些建议。我对 Controller 和模型的名称如何工作感到有些困惑。如果我希望我公司页面的网址为 http://examp
codeigniter - CodeIgniter:插入多个记录而无需循环
可以在CodeIgniter Active Record中使用多个INSERT记录，而无需for，foreach等。我当前的代码: foreach($tags as $tag) { $tag
codeigniter - Codeigniter 事件记录中的子查询
SELECT * FROM certs WHERE id NOT IN (SELECT id_cer FROM revokace); 如何在 CodeIgniter 事件记录中编写上述 select
codeigniter - wkhtmltopdf codeigniter
wkhtmltopdf 听起来是一个很好的解决方案...问题是 exec 上没有任何反应 shell_exec("c:\wkhtmltopdf.exe","http://www.google.com
codeigniter - CodeIgniter:基于文件夹和子文件夹的URL结构
我当前的CodeIgniter有点问题。我有一个带有“页面” Controller 的CI安装程序，该 Controller 可从/ views加载静态文件，但它最多只能包含1个子文件夹，而我正在向其
codeigniter - Codeigniter 分页库中的首页链接问题
有一段时间，我一直在处理分页类中的一个问题。问题是，除了第 1 页的链接之外，所有分页的内容都可以。所有链接都是这样的: example.com/method/page/2 example.com
codeigniter - CodeIgniter 中是否有中间件的概念？
我想对请求进行一些预处理和后处理，例如处理身份验证、加载上下文数据、性能时间等等。来自 Django 的概念是 MIDDLEWARE_CLASSES这让我可以在各个阶段处理请求:https://doc
codeigniter - CodeIgniter 中的全局变量不起作用
我想通过创建自己的库和配置文件在 CodeIgniter 中生成全局变量。这就是我在我的库文件中编写的，比如说 globalvars.php。我把它放在/application/libraries 中
codeigniter - 如何在没有配置的情况下设置分页链接的样式 - codeigniter
我有以下分页样式 Previous Page

首页

博学

6Ren·AI

商城

ajax - CodeIgniter Ajax 表单 - 提交表单