Запретить отправку формы - jquery?

Можно создать дубликат:
How to prevent form from being submitted?Запретить отправку формы - jquery?

Вот мой JQuery код:

$(document).ready(function() { 
    $("#register").submit(function (event) { 
    var email = $('#email-agency').val(); 
    /* EMAIL VALIDATION */ 
    if (email == ""){ 
     $('#email-agency').css({"border-color":"#3399ff"}); 
     $('#email-err').html("You must enter your e-mail address.").removeClass("success_msg").addClass("error_msg"); 
    }else{ 
     $('#email-err').html("<img src='http://www.site.com/folder/ajax-loader.gif' />&nbsp;&nbsp;&nbsp;Validating the e-mail address...").removeClass("success_msg").removeClass("error_msg"); 
     $.get('http://www.site.com/folder/email.php',{id: email}, function(result){ 
      if (result == "invalid format"){ 
       $('#email-agency').css({"border-color":"#3399ff"}); 
       $('#email-err').html(email + " is not a valid e-mail address.").removeClass("success_msg").addClass("error_msg"); 
       event.preventDefault(); 
       return false; 
      }else if (result == "taken"){ 
       $('#email-agency').css({"border-color":"#3399ff"}); 
       $('#email-err').html("I'm sorry, this e-mail address is already taken.").removeClass("success_msg").addClass("error_msg"); 
       event.preventDefault(); 
       return false; 
      }else if (result == "available"){ 
       $('#email-agency').css({"border-color":"#1f6d21"}); 
       $('#email-err').html("Congratulations, this e-mail address is available.").removeClass("error_msg").addClass("success_msg"); 
       return true; 
      } 
     }) 
    } 
});

По какой-то причине, если адрес электронной почты взят (result == "taken") - форма еще представляет.

Что я делаю неправильно? Как я могу сделать форму не отправленной, если был отправлен адрес электронной почты?

Спасибо

источник

2011-09-23 Latox

Это потому, что вы возвращаете false из $.get(function() вместо $("#register").submit(function()

Потому что ваш вызов AJAX делаются асинхронными вы также не может установить переменный с возвращаемым значением AJAX вызов.

Поскольку функция уже завершена, пока вызов AJAX все еще продолжается.

Вы могли бы использовать:

async: false

И вместо того, чтобы делать возвращать ложные/истинный сделать:

вар действует = false; // в верхней части представить функцию

и вместо того, чтобы делать возвращения делать: valid = true; // или ложные

И в конце функции представить сделать:

return valid;

EDIT

Извините.

При взгляде на документы .get() это выглядит так: .get() не принимает асинхронный параметр.

Вместо этого вы можете использовать функцию .ajax(). (get является сокращением для ajax).

http://api.jquery.com/jQuery.ajax/

EDIT2

$(document).ready(function() { 
    $("#register").submit(function (event) { 

    var valid = false; 

    var email = $('#email-agency').val(); 
    if (email == ""){ 
     $('#email-agency').css({"border-color":"#3399ff"}); 
     $('#email-err').html("You must enter your e-mail address.").removeClass("success_msg").addClass("error_msg"); 
    }else{ 
     $('#email-err').html("<img src='http://www.site.com/folder/ajax-loader.gif' />&nbsp;&nbsp;&nbsp;Validating the e-mail address...").removeClass("success_msg").removeClass("error_msg"); 
     $.get('http://www.site.com/folder/email.php',{id: email}, function(result){ 
      if (result == "invalid format"){ 
       $('#email-agency').css({"border-color":"#3399ff"}); 
       $('#email-err').html(email + " is not a valid e-mail address.").removeClass("success_msg").addClass("error_msg"); 
       event.preventDefault(); 
       valid false; 
      }else if (result == "taken"){ 
       $('#email-agency').css({"border-color":"#3399ff"}); 
       $('#email-err').html("I'm sorry, this e-mail address is already taken.").removeClass("success_msg").addClass("error_msg"); 
       event.preventDefault(); 
       valid false; 
      }else if (result == "available"){ 
       $('#email-agency').css({"border-color":"#1f6d21"}); 
       $('#email-err').html("Congratulations, this e-mail address is available.").removeClass("error_msg").addClass("success_msg"); 
       valid true; 
      } 
     }) 
    } 
    return valid; 
    }); 
});

источник

2011-09-23 07:26:23 PeeHaa

Как вернуться из основной функции представить? – Latox

'return valid;' в конце функции – PeeHaa

Почему downvote? – PeeHaa

Вобще:

return $.get('http://www.site.com/folder/email.php',{id: email}, function(result){ 
    //more code 
}

источник

2011-09-23 07:27:52 Snicksie

У меня есть более чем одна проверка, я включил в нее только часть сообщений электронной почты, поскольку это единственная проблема, с которой я столкнулся. Я думаю, это потому, что event.preventDefault() переписывается с результатом AJAX. return false; не работает. – Latox

'event.preventDefault()', похоже, не работает. Возможно, вы можете назначить каждую проверку переменной, и если один из варов является valse, вы возвращаете false в вашу форму. – Snicksie

Вы делаете асинхронный вызов, который означает, что ваша первая функция будет возвращать. Вместо этого вы должны сделать, если хотите сделать так, чтобы вернуть false при первом вызове. Затем в зависимости от ответа на второй вызов вы можете вызвать $ («форма»). Submit() или показать ошибку. Прямо сейчас вы возвращаете false в обратный вызов AJAX.

По сути вы хотите сделать это:

function validate(e){ 
    e.preventDefault(); //Stop form from submitting 

    $.get(/*foo*/, function(response){ 
    if(response){ //yay validates 
     $("form").submit(); 
    }else{ //Doesn't validate show error. 
     $("form .error").show(); 
    } 
    }); 
}

источник

2011-09-23 07:29:29

Запретить отправку формы - jquery?

ответ

Смежные вопросы