如果验证在ajax回调中失败，如何停止提交表单？
如果验证在ajax回调中失败，如何停止提交表单？
提问于 2016-05-24 14:29:38
在使用ajax进行验证之后，我正在尝试提交一个表单。在ajax返回之后，如果输入字段是有效的，那么表单应该提交否则的错误消息。下面是我的html
<form action="new-join.php" method="post" enctype="multipart/form-data" onSubmit="return CheckForm()" id="NewJoinsub">
<!-- my form -->
<button type="submit" class="button btn btn-primary btn-large">Continue</button>
</form>而ajax是
<script>
function CheckForm(e) {
var checkpin=$("#JoiningPin").val();
$.post("check-pin.php", { checkpin: checkpin },
function(result){
//if the result is 1 submit
if(result == 1){
$('#NewJoinsub').submit()
}else{
var response_not = "<div style='color: #f30;'>Not A Valid Pin or Already Used</div>";
$('#pinCheck').html(response_not);
e.preventDefault();
}
});
}(jQuery);
</script>我的表单验证是正确的，但如果条件失败，它不会阻止表单提交。我在哪里做错事？
回答 3
Stack Overflow用户
回答已采纳
发布于 2016-05-24 14:50:28
请查看以下内容：
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form action="new-join.php" method="post" enctype="multipart/form-data" id="NewJoinsub">
<!-- my form -->
<button type="submit" class="button btn btn-primary btn-large">Continue</button>
</form>
<script>
$('#NewJoinsub').on('submit',function(e) {
e.preventDefault();
var checkpin=$("#JoiningPin").val();
$.post("check-pin.php", { checkpin: checkpin }, function(result){
//if the result is 1 submit
if(result == 1){
$(this).submit();
}
else {
var response_not = "<div style='color: #f30;'>Not A Valid Pin or Already Used</div>";
$('#pinCheck').html(response_not);
}
});
});
</script>
您必须先到e.preventDefault()；！
要完成您的示例：
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form action="new-join.php" method="post" enctype="multipart/form-data" id="NewJoinsub" onsubmit="checkForm(event);">
<!-- my form -->
<button type="submit" class="button btn btn-primary btn-large">Continue</button>
</form>
<script>
function checkForm(e) {
e.preventDefault();
var checkpin=$("#JoiningPin").val();
$.post("check-pin.php", { checkpin: checkpin }, function(result){
//if the result is 1 submit
if(result == 1){
$(this).submit();
}
else {
var response_not = "<div style='color: #f30;'>Not A Valid Pin or Already Used</div>";
$('#pinCheck').html(response_not);
}
});
}(jQuery);
</script>
Stack Overflow用户
发布于 2016-05-24 14:36:14
我认为在您的其他部分中添加一个return false;就像这样：
else {
var response_not = "<div style='color: #f30;'>Not A Valid Pin or Already Used</div>";
$('#pinCheck').html(response_not);
e.preventDefault();
return false;
} Stack Overflow用户
发布于 2016-05-24 14:45:16
试一试:删除按钮类型。添加单击事件按钮并删除表单的onsubmit。请看下面的代码。
<form action="new-join.php" method="post" enctype="multipart/form-data" id="NewJoinsub">
<!-- my form -->
<button class="button btn btn-primary btn-large">Continue</button>
</form>
<script>
$('document').ready(function(){
$('.button').click(CheckForm);
});
function CheckForm(e) {
var checkpin=$("#JoiningPin").val();
$.post("check-pin.php", { checkpin: checkpin },
function(result){
//if the result is 1 submit
if(result == 1){
$('#NewJoinsub').submit()
}else{
var response_not = "<div style='color: #f30;'>Not A Valid Pin or Already Used</div>";
$('#pinCheck').html(response_not);
e.preventDefault();
}
});
}(jQuery);
</script>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/37416554
复制相关文章
相似问题
腾讯云开发者
