Объединение JQuery Validate и AJAX формы отправки

Question

У меня есть простая форма, такая как

<form id="invite_form">

    <input type="text" name="invite_email" id="invite_email" />

    <textarea name="invite_message">Hello!</textarea>

    <div id="send_div">
         <span id="send_btn">Send</span> 
    </div>
</form>

Мой JS выглядит следующим образом для отправки формы через Ajax:

$('#send_btn').live('click', function(event){
    event.preventDefault();

    var form = $('#invite_form');

    $.ajax({
        url: '/invite',
        type: "POST",
        data: form.serialize(),
        dataType: "html",
        success: function(html) {
            $('#send_div').html('Success!');
        }
    });
});

Это прекрасно работает.

Теперь я хотел бы обернуть функцию jQuery Validate вокруг этого кода, чтобы убедиться, что [1] поле электронной почты заполнено и [2] является действительной электронной почтой.

Я использую bassistance Джорна.Модуль проверки jQuery от http://bassistance.de/jquery-plugins/jquery-plugin-validation/.

Кто-нибудь может дать план, как связать вызов проверки с этим ajax?

Спасибо за помощь, очень признателен.

Answer 1

Попробуйте это:

$('#send_btn').live('click', function(event){
    event.preventDefault();

    var form = $('#invite_form');
    if(form.valid()) {
        $.ajax({
            url: '/invite',
            type: "POST",
            data: form.serialize(),
            dataType: "html",
            success: function(html) {
                $('#send_div').html('Success!');
            }
        });
    else {
     ;   //do whatever if the form is not valid
    }
});