提交返回False，但是仍然提交表单—PHP、Javascript、AJAX、CodeIgniter

This is probably going to sound backwards. I need for a form to submit return false, but still submit the form.

这可能听起来有点反了。我需要一个表单提交返回false，但仍然提交表单。

I have a form being pulled into a page via ajax (jquery load function), and on submit I'd like to display a graphic and some text in the same div, rather than redirect the page.

我通过ajax (jquery load函数)将一个表单拖放到一个页面中，在提交时，我希望在同一个div中显示一个图形和一些文本，而不是重定向页面。

This is my submit button (codeigniter):

这是我的提交按钮(codeigniter):

<?php $attributes = array('class' => 'button', 'onclick' => 'form_success_client(); return false;', 'name' => 'submit'); echo form_submit( $attributes, 'Save'); ?>

and in html:

在html中:

<input type="submit" onclick="form_success(); return false;" class="button" value="Save" name="submit">

and the javascript function which loads the success message:

以及加载成功消息的javascript函数:

 function form_success_client() { // form success
    $('.contentarea').load("/mm/index.php/site/form_success_client/");
 }

That all works fine, but unsurprisngly it doesn't submit the form. I know that the proper way to do this, is to pass the form submission over to jquery, but I'm not sure how to do that. Could do with a quick fix if possible (until I have time to sort a better solution out), however all suggestions appreciated.

这一切都很好，但不令人惊讶的是它没有提交表单。我知道正确的方法是将表单提交传递给jquery，但我不确定如何做到这一点。如果可能的话，可以快速修复(直到我有时间找到更好的解决方案)，尽管所有的建议都值得欣赏。

Thanks!

谢谢!

ANSWER:

答:

This is what worked for me, just a slight edit of Maggie's answer:

这对我很有帮助，只是对麦琪的回答做了一点小小的修改:

function form_success_client(obj) {
    $.ajax({
       type: 'POST',
       url: $(obj).attr('action'),
       data: $(obj).serialize(),
       success: function(msg){
         $('.contentarea').load("/mm/index.php/site/form_success_client/");
       }
     });
     return false;
}

Note the $() wrapping obj on url and data.

注意在url和数据上包装obj $()。

3 个解决方案

#1

bind your JS onclick-event to the form (not the button) like this 'onclick' => 'form_success_client(this); return false;'

将JS onclick-event绑定到窗体(而不是按钮)，如“onclick”=> 'form_success_client(以下);返回false,“

and change your function to

把函数改成

function form_success_client(obj) {
    $.ajax({
       type: "POST",
       url: obj.attr("action"),
       data: obj.serialize(),
       success: function(msg){
         $('.contentarea').load("/mm/index.php/site/form_success_client/");
       }
     });
}

untested

未测试的

#2

Possible solution. I'm sticking to your code

可能的解决方案。我坚持你的准则

<input type="submit" onclick="form_success_client(this); return false;" class="button" value="Save" name="submit">

function form_success_client( i ) {
   formData = $(i).parents('form').serialize();
   $.post( "/mm/index.php/site/form_success_client/", formData, function(loaded) { $('.contentarea').append(loaded) }, 'html' );
}

EDIT: And yes, as maggie said, you should bind form_success_client(this); return false; like that

编辑:是的，正如maggie所说，您应该绑定form_success_client(this);返回错误;像这样

<form onsubmit="form_success_client(this); return false;">

not to the button

没有这个按钮

#3

You can use jquery .post , .get or .ajax

您可以使用jquery .post、.get或.ajax

based on SUCCESS or returned data you can submit the form

根据成功或返回的数据，您可以提交表单

http://api.jquery.com/jQuery.get/

http://api.jquery.com/jQuery.post/

http://api.jquery.com/jQuery.ajax/

#1