CodeIgniter和AJAX表单提交 [英] CodeIgniter and AJAX form submit

问题描述

我正在尝试将从表单提交的数据保存到我的mysql数据库中，然后更新div元素，其中最后一个已发布的项目前置于div中的列表。

I am trying to save data submitted from a form into my mysql database and and then update the div element with the last posted item prepended to the list in the div.

现在我只是想回复一个回复，我现在并不担心格式正确。

Right now I am only trying to get a response back, I'm not worried about having the formatting correct at the moment.

我的问题是赢得的表格'提交时使用 e.preventDefault（）; 提交，但没有它，表单会执行发布到数据库然后刷新页面的常规方法。

My problem is the form won't submit with e.preventDefault(); in place, but without it the form does the normal method of posting to the db then refreshing the page.

这是我的AJAX电话：

Here is my AJAX call:

$(document).ready(function() {

    $('form#feedInput').submit(function(e) {

        e.preventDefault();

        $.ajax({
            type: "POST",
            url: "<?php echo site_url('dashboard/post_feed_item'); ?>",
            data: $('.feed-input').val(),
            dataType: "html",
            success: function(data){
                debugger;
                $('#feed-container').prepend(data);
            },
            error: function() { alert("Error posting feed."); }
       });

    });
});

我认为我不需要发布我的控制器代码，看看我的问题是怎样的表单不会超过 e.preventDefault（）; 函数。

I don't think it's necessary for me to post my controller code, seeing as how my issue is the form won't make it past the e.preventDefault(); function.

我怎样才能得到这个如果 e.preventDefault（）函数在它到达 $。ajax（）功能？

How can I get this form to submit via AJAX if the e.preventDefault() function is stopping it before it can reach the $.ajax() function?

推荐答案

ajax调用的数据属性是无效。它应该是JSON格式 {key：$（'。feed-input'）。val（）} 或查询格式'key = '+ $（'。馈输入'）。VAL（）。
成功方法中还有一个不必要的调试器变量。

The data attribute of the ajax call is invalid. It should be either in JSON format { key: $('.feed-input').val() } or in query format 'key='+$('.feed-input').val(). Also there is an unnecessary debugger variable in the success method.

一个工作代码可能是：

A working code could be:

$('form#feedInput').submit(function(e) {

    var form = $(this);

    e.preventDefault();

    $.ajax({
        type: "POST",
        url: "<?php echo site_url('dashboard/post_feed_item'); ?>",
        data: form.serialize(), // <--- THIS IS THE CHANGE
        dataType: "html",
        success: function(data){
            $('#feed-container').prepend(data);
        },
        error: function() { alert("Error posting feed."); }
   });

});

这篇关于CodeIgniter和AJAX表单提交的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！