0

我有一个包含姓名、电子邮件、消息和验证码字段的表单。

我可以提交表单并可以在服务器端验证验证码，如果一切正常，我必须使用 requestDispatcher 显示一个 jsp。如果验证码正确，一切正常，但如果不正确，我会将用户重定向到显示表单的同一页面，以便用户可以重新输入验证码。但是这种方法的主要问题是表格被清除了，这意味着用户必须重新填写整个表格。我怎样才能避免这种事情，以便用户不需要重新填写表格。

他们还有其他更好的方法吗？

我已经尝试进行 ajax 调用来验证验证码，但这种方法存在一些问题。无法在 jquery ajax 回调函数中提交表单

4

2 回答 2

0

您必须在 JS 代码中使用XmlHTTPRequest 。

您分配回调以获取答案并根据需要处理它。在我的情况下，我从服务器获取要输出的代码，所有输入的表单保持在以前的状态，并且修改了 html 页面上唯一的 div“输出”。

这是我的程序的一个简短示例：页面的 html

<script type="text/javascript" src="./js/script.js">/script>
<form name="someForm">
<p><b>Enter your text here:</b></p>`

<p><textarea rows="10" cols="45" name="code"></textarea></p>
<input type="button" value="Send it" onclick="sendIt()"/>
</form> </code>
<div id="output"></div>

在我的情况下 script.js 只更新页面的一部分

function sendIt() {
    var theCode = document.codeHolderForm.code.value;
    var linkToDiv = document.getElementById("output");
    linkToDiv.innerHTML = 'p> Server response below: p>';

    var request = getXmlHttp();

    request.open("POST", "/", true);
    request.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
    request.onreadystatechange = function () {
        if (request.readyState != 4) return;

        if (request.status == 200) {
            linkToDiv.innerHTML += 'p>' + request.responseText + '/p>';
        } else {
            handleError(request.statusText);
        }
    };

    request.send("code=" + theCode);

}

function handleError(message) {
    alert("Error: "+message)
}

function getXmlHttp() {
    var xmlhttp;
    try {
        xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
    } catch (e) {
        try {
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        } catch (E) {
            xmlhttp = false;
        }
    }
    if (!xmlhttp && typeof XMLHttpRequest != 'undefined') {
        xmlhttp = new XMLHttpRequest();
    }
    return xmlhttp;
}
于 2012-07-26T18:58:50.830 回答
0

你可以做这样的事情，在某些 div 上调用 click 事件说“提交”，然后调用 ajax 调用并获得结果。根据结果​​，您可以决定是否提交表格。

submit 是 DIV printCoupon 是表单

$("#submit").click(function(){

        var response = '';
        $.ajax({ type: "GET",   
                 url: "ajaxprintcoupon",   
                 async: false,
                 success : function(text)
                 {
                     response = text;
                 }
        });

        alert(response);

        if(response == 'Testing'){
            $('#printCoupon').submit();
        }else{
            // no change
        }
    });
于 2012-07-26T19:09:03.227 回答