JQuery submit () HTML-форма на основе возвращаемого значения PHP-скрипта

Question

Хорошо, если бы кто-нибудь мог взглянуть на это, я был бы очень благодарен. Я внедряю капчу в HTML-форме. Капча основана на php, поэтому мне нужно использовать jquery для отправки отправленной формы в скрипт проверки капчи.

Скрипт php возвращает 1, если проверка была правильной, или 0, если она была неправильной.

Все это прекрасно работает, у меня проблемы с отправкой формы или предотвращением ее на основе того, что возвращает php-скрипт. Мой код выглядит следующим образом:

                <form id="contactform" action="FormHandler.cgi" method="POST">
    <input name="requiredContact" size="25" type="text" />

    <input name="requiredEmailFrom" size="25" type="text" />
    <input name="requiredTelephone" size="18" tabindex="3" />
    <textarea cols="25" name="comments" rows="4"></textarea>
    <select length="2" name="requiredContactMethod" tabindex="5">
    <option selected="" value="Email">Email</option>
    <option value="Telephone">Telephone</option>
    </select>
    <img src="captcha/captcha.php" style="float:none; margin:0px 0px -8px 0px; height:26px;"></img>
    <input type="text" id="CAPTCHA" style="margin-left: -5px; height:26px;">
            <p id="caperror"></p>
    <p><input name="B1" type="submit" value="Submit" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
    <input name="B2" type="reset" value="Clear" /></p>
</form> 

<script>



$('#contactform').submit(function(){
var cap = $('#CAPTCHA').val();  
cap = 'CAPTCHA=' + cap;

$.ajax({
type: 'POST',
url: 'captcha/capcheck.php',
data: cap,
dataType: "text",
error: postfail,
 success: success
});

return false;  //Temporary, to stop the form no matter what.
});

function success(result){

if(result == 1){
alert('was correct');
return true;
}
else{
alert("error" + result);
return false;
}


}

function postfail(){
alert('post failed');
    return false;
}


</script>

Так что я бы хотел, чтобы, когда моя функция успеха возвращала false, она не позволяла отправке формы. Если он возвращает true, отправьте форму. Это то, что я хотел бы

$('#contactform').submit(function(){


//The ajax post here

//check the value of the ajax success function here;

if(success(result)) {
return true;
}
else {
return false;
}
});

Я не очень хорош с областями функций в javascript. Если я определяю переменную внутри функции успеха, я не могу проверить значение в функции отправки формы, потому что она имеет только локальную область видимости. Я мог бы просто использовать ссылку для отправки формы, а затем вызвать submit (); но я хочу, чтобы форма была доступна тем, у кого нет Java.

Есть ли способ вернуть результат функции пост-успеха ajax обратно в область действия обработчика submit ()?

Answer 1

Я бы написал функцию, подобную этой, только установив submitForm для результата 1.

$('#contactform').submit(function(){
   var submitForm = False;
   var cap = $('#CAPTCHA').val();  
   cap = 'CAPTCHA=' + cap;

$.ajax({
   type: 'POST',
   url: 'captcha/capcheck.php',
   data: cap,
   dataType: "text",       
   success:function(result){
       if(result == 1){
          submitForm = True;
       }
   }
   });

    return submitForm;  
});

Answer 2

Я собирался предложить, чтобы в вашей функции success вы вызывали $('#contactform').submit(), но это просто вызвало бы ваш обработчик событий снова, и вы застряли бы в цикле.

Вместо этого вы можете вызвать функцию submit элемента формы, например:

$('#contactform').submit(function(){
    var cap = $('#CAPTCHA').val();  
    cap = 'CAPTCHA=' + cap;
    myform = this; // added this line

    $.ajax({
        type: 'POST',
        url: 'captcha/capcheck.php',
        context: myform, //added this line
        data: cap,
        dataType: "text",
        error: postfail,
        success: success
    });

    return false;  //Temporary, to stop the form no matter what.
});

function success(result){
    // because we added the context option, we can now access the form with the "this" keyword
    if(result == 1){
        alert('was correct');
        // $('#contactform').submit() // this will make an infinite loop
        this.submit();  // this will submit the form
        return true;
    }else{
        alert("error" + result);
        return false;
    }
}

Answer 3

Если я что-то упустил, вы должны отправить форму в функции успеха вызова AJAX.Вызов AJAX также не должен создаваться при отправке формы.Форма не должна быть отправлена ​​каким-либо образом, пока проверка не вернется.IE:

$.ajax(
    //Parameters and stuff
    ).success(function() {
        //Submit the form
        $('#contactform').submit();
    }).fail(function() {
        //Onoes your call has failed. Do not submit le form :(
    });

Что касается определения области действия, это не должно быть проблемой определения объема.Дайте мне знать, если вам нужна дополнительная инструкция.

Answer 4

Попробуйте сделать ajax-вызов на кнопке отправки, а не на отправке формы.

Если ответ на вызов click верен, вы вызываете функцию отправки.