简体   繁体   English

如果Ajax返回false,如何防止表单提交

[英]How to prevent form submit if Ajax returns false

Hello I am using old way to use Ajax, not using jQuery. 您好,我使用的是使用Ajax的旧方法,而不是使用jQuery。 I want to stop form submitting if my ajax code returns false. 如果我的Ajax代码返回false,我想停止提交表单。 I am calling an Ajax function on submit and returning back to jsp form. 我在提交时调用Ajax函数,并返回到jsp表单。
Here is my code: 这是我的代码:

<form name="signupform" method="post"  action="../TenantSignup" onsubmit="return checkCaptcha1()">
</form>

here is the ajax code: 这是ajax代码:

function checkCaptcha1(){
alert("inside checkCaptcha1");
//alert(document.signupform.recaptcha_response_field.value.trim());
var recaptcha_challenge_field = document.signupform.recaptcha_challenge_field.value.trim();
alert(recaptcha_challenge_field);
var recaptcha_response_field = document.signupform.recaptcha_response_field.value.trim();
alert(recaptcha_response_field);
if(recaptcha_response_field.trim()==""){
    document.getElementById("captcha").innerHTML = "Enter CAPTCHA Code";
    return false;
}else{
    xmlHttp=GetXmlHttpObject();
    alert(XMLHttpRequest);
    if (xmlHttp==null)
    {
        alert ("Browser does not support HTTP Request");
        return false;
    }
    var url="../ajax/checkCaptcha.jsp";
    url=url+"?recaptcha_challenge_field="+recaptcha_challenge_field+"&"+"recaptcha_response_field="+recaptcha_response_field;
    alert(url);
    xmlHttp.onreadystatechange=showData;
    xmlHttp.open("GET",url,false);
    xmlHttp.send(null);
}

 }

 function showData(){
if (xmlHttp.readyState==4 || xmlHttp.readyState==200)
{
    alert("hello");
    var showdata = xmlHttp.responseText;
    alert(showdata);
    var str = showdata.split("#$");
    //alert("inside checkCaptcha2 str="+str);
    alert("Str[1]="+str[1]);
    if(str[1]=="fail"){
        alert(str[1]);
        document.getElementById("captcha").innerHTML = "CAPTCHA Validation Failed ! Try Again";
        //flag2=0;
        //alert("Set flag2="+flag2);
        return false;
        //window.location.href("signup.jsp");
    }
    else{
        //alert("Success");
        document.getElementById("captcha").innerHTML = "";
        //flag2 = 1;
        //alert("Set flag2="+flag2);
        //alert("Calling validate2()");
        //validate2();
        return true;
    }
}
else{

}
}
function GetXmlHttpObject()
{
alert("XML Object created");
var xmlHttp=null;
try
{
    // Firefox, Opera 8.0+, Safari
    xmlHttp=new XMLHttpRequest();
}
catch (e)
{
    //Internet Explorer
    try
    {
        xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
    }
    catch (e)
    {
        xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
}

return xmlHttp;
}

Here is the checkCaptcha.jsp Page: 这是checkCaptcha.jsp页面:

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<%@ page import="net.tanesha.recaptcha.ReCaptchaImpl"%>
<%@ page import="net.tanesha.recaptcha.ReCaptchaResponse"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"   
 "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
<% System.out.println("Hello check CAPTCHA"); %>
<%  try{
        String remoteAddr = request.getRemoteAddr();
        System.out.println(remoteAddr);
        ReCaptchaImpl reCaptcha = new ReCaptchaImpl();
        reCaptcha.setPrivateKey("6LdlHOsSAAAAACe2WYaGCjU2sc95EZqCI9wLcLXY");

        String challenge = request.getParameter("recaptcha_challenge_field");
        System.out.println(challenge);
        String uresponse = request.getParameter("recaptcha_response_field");
        System.out.println(uresponse);
        ReCaptchaResponse reCaptchaResponse = reCaptcha.checkAnswer(remoteAddr, challenge, uresponse);

        if (reCaptchaResponse.isValid()) {
            System.out.print("#$success#$");
            out.print("#$success#$");
        } else {
            System.out.print("#$fail#$");
            out.print("#$fail#$");
        }
    }catch(NullPointerException e){
        e.printStackTrace();
    }catch(Exception e){
        e.printStackTrace();
    }
  %>
</body>
</html>

I don't want to submit the form if the ajax retuns false.. but here it is still submitting the form if the ajax returns false. 如果ajax重新设置为false,我不想提交表单。但是,如果ajax返回false,它仍然在提交表单。 Here I am using synchronous request, even if I make asynchronous request same thing happens. 在这里,即使我进行异步请求,我也会使用同步请求。

Please help me Thank you. 请帮帮我,谢谢。

I would force the form's onsubmit option to return false each time and submit the form's data via ajax, thus you can run a check to where ever you'd like and then submit the form. 我会强制表单的onsubmit选项每次都返回false并通过ajax提交表单数据,因此您可以对所需位置进行检查,然后提交表单。 Then redirect to another page if needed. 然后根据需要重定向到另一个页面。 It's bulky but will work for forms that aren't too complicated. 它体积庞大,但适用于不太复杂的表单。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM