我正在尝试将从表单提交的数据保存到我的mysql数据库中,然后更新div元素,其中最后一个已发布的项目前置于div中的列表.
我的问题是表单不会用e.preventDefault()提交;到位,但没有它,表单执行发布到数据库然后刷新页面的常规方法.
这是我的AJAX调用:
$(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();功能.
如果e.preventDefault()函数在它到达$.ajax()函数之前停止它,我如何通过AJAX提交此表单?
解决方法:
ajax调用的data属性无效.它应该是JSON格式{key:$(‘.Feed-input’).val()}或查询格式’key =’$(‘.Feed-input’).val().
在success方法中还有一个不必要的调试器变量.
工作代码可以是:
$('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."); }
});
});