无法在jquery ajax回调函数中提交表单 [英] Unable to submit form in jquery ajax callback function
本文介绍了无法在jquery ajax回调函数中提交表单的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我试图在使用ajax请求验证验证码之后提交表单 - 如果captcha验证成功，我必须提交表单。
这里是表单：
< form action =Feedbackmethod =postname =contact_usid =contact_us_form>
< table id =contact_us_tablestyle =font-family：'Muli'，serif; font-weight：bold; margin-left：26px; margin-top：39px;>
< tr>
< td> < / TD>
< td height =20pxstyle =color：red; font-size：12px; ID = msg 中> < / TD>
< / tr>
< tr>
< td>< span style =color：red> *< / span>名称< / td>
< td> < input type =textname =nameid =name/> < / TD>
< / tr>
< tr>
< td>< span style =color：red> *< / span>电子邮件< / td>
< td> < input type =textname =emailid =email/> < / TD>
< / tr>
< tr>
< td width =100px;>< span style =color：red> *< / span> Message< / td>
< td> < textarea style =max-width：420px; width：420px; height：100; name =messageid =message>< / textarea>< / td>
< / tr>
< tr>
< td height =50px;>< / td>
< td>人工验证。< / td>
< / tr>
< tr>
< td>< img src =<％= GlobalData.SERVER_ROOT +simpleCaptcha.png％>>< / td>
< td height =20px;>< input type ='text'name ='answer'id =answervalue =''> < / TD>
< / tr>
< tr>
< td>< / td>
< td> < button class =button1id =submit>提交< / button> < / TD>
< / tr>
< / table>
< / form>
这里是javascript：
<$ p $（$＃$）$（$＃$）$（＃email）。$（$＃＃email）。 （）;
var name = $（＃name）.val（）;
var message = $（＃message）.val（）;
var answer = $（ #answer）。val（）;
if（name ==）{
$（＃name）。focus（） ;
$（＃msg）。html（Please enter your name）;
return false;
}
else if（email ==）{
$（＃email）。focus（）;
$（＃msg）。html（请输入电子邮件）;
返回false;
}
else if（！isValidEmailAddress（email））{
$（＃email）。focus（）;
$（＃msg）。html（Email should like：john @ example.com）;
返回false;
}
else if（message ==）{
$（＃message）。focus（）;
$（＃msg）。html（请写下你的信息）;
返回false;
}
else if（answer ==）{
$（＃answer）。focus（）;
$（＃msg）。html（输入你在图片中看到的内容）;
返回false;
$ b $ .ajax（{
类型：POST，
网址：CheckCaptcha，
数据：{答案：答案}
}）。done（函数（msg）{
// alert（msg）;
if（msg ==true）{
// $（'＃contact_us_form'）。submit（）;
// $（'＃contact_us_form'）。submit（）;
$（＃contact_us_form）。unbind 'submit'）。submit（）;
//setTimeout(document.getElementById('contact_us_form'）。submit（），10）;
}
else {
$（ #answer）。focus（）;
$（＃msg）。html（Captcha Incorrect）;
return false;
}
}）。error （function（）{
}）;
}）;
您可以在javascript中看到：
<$ p （$ msg ==true）{
// $（'＃contact_us_form'）。submit（）; $ p> if
$（＃contact_us_form）。unbind（'submit'）。submit（）;
//setTimeout(document.getElementById('contact_us_form'）。submit（），10）;
}
我已经尽力了。但它不起作用。
是他们有什么不对吗？
:
此代码适用于我单击提交两次的情况。 >解决方案
正因为如此：
< button class =button1id = 提交 >提交< /按钮>
永远不要使用'type'作为名称或ID
我使用 submit 作为id。这就是为什么代码无法正常工作。
当我将其更改为
时， < button class =button1id =submit_button>提交< / button>
有效！
I am trying to submit a form after validating captcha using an ajax request - if captcha is validated successfully , i have to submit the form.
here is the form :
<form action="Feedback" method="post" name="contact_us" id="contact_us_form">
<table id="contact_us_table" style="font-family: 'Muli', serif;font-weight:bold;margin-left: 26px;margin-top: 39px;">
<tr>
<td> </td>
<td height="20px" style="color: red;font-size: 12px;" id="msg"> </td>
</tr>
<tr>
<td><span style="color: red">*</span>Name </td>
<td> <input type="text" name="name" id="name" /> </td>
</tr>
<tr>
<td><span style="color: red">*</span>Email </td>
<td> <input type="text" name="email" id="email" /> </td>
</tr>
<tr>
<td width="100px;"><span style="color: red">*</span>Message </td>
<td> <textarea style="max-width:420px;width: 420px; height: 100;" name="message" id="message"></textarea></td>
</tr>
<tr>
<td height="50px;"></td>
<td>Human Verification.</td>
</tr>
<tr>
<td><img src="<%=GlobalData.SERVER_ROOT+"simpleCaptcha.png"%>"></td>
<td height="20px;"><input type='text' name='answer' id="answer" value=''> </td>
</tr>
<tr>
<td></td>
<td> <button class="button1" id="submit">Submit</button> </td>
</tr>
</table>
</form>
and here is the javascript :
$("#contact_us_form").submit(function(e){
e.preventDefault();
var email = $("#email").val();
var name = $("#name").val();
var message = $("#message").val();
var answer = $("#answer").val();
if(name == ""){
$("#name").focus();
$("#msg").html("Please enter your name");
return false;
}
else if(email == ""){
$("#email").focus();
$("#msg").html("Please enter an email");
return false;
}
else if(!isValidEmailAddress(email)){
$("#email").focus();
$("#msg").html("Email should be like : john@example.com");
return false;
}
else if(message == ""){
$("#message").focus();
$("#msg").html("Please write your message");
return false;
}
else if(answer == ""){
$("#answer").focus();
$("#msg").html("Enter what you see in image.");
return false;
}
$.ajax({
type: "POST",
url: "CheckCaptcha",
data: {answer:answer}
}).done(function(msg) {
// alert(msg);
if(msg == "true"){
//$('#contact_us_form').submit();
//$('#contact_us_form').submit();
$("#contact_us_form").unbind('submit').submit();
//setTimeout(document.getElementById('contact_us_form').submit(), 10);
}
else{
$("#answer").focus();
$("#msg").html("Captcha Incorrect");
return false;
}
}).error(function(){
});
});
You can see in javascript :
if(msg == "true"){
//$('#contact_us_form').submit();
$("#contact_us_form").unbind('submit').submit();
//setTimeout(document.getElementById('contact_us_form').submit(), 10);
}
i have tried all i can . but it didn't work.
is their anything wrong ?
EDIT ::
This code works if i click submit two times..
解决方案
It's just because of this :
<button class="button1" id="submit">Submit</button>
NEVER USE 'type' as a name or id
i was using submit as an id. that is why the code was not working..
when i changed it to
<button class="button1" id="submit_button">Submit</button>
it worked !
这篇关于无法在jquery ajax回调函数中提交表单的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
