Плагин метода JQuery validate () с JS submit

Question

У меня есть следующий код:

<a href="#" onclick="submit_form('http://allstateagents.contextoptional.com//create_lead'); return false;"><img alt="Btn_requestaquote" src="http://a0.allstateagents.contextoptional.com/images/btn_requestAquote.png?1317752211"></a>

что соответствует:

function submit_form(posturl) {
    $.ajax({
      url: '/create_lead',
      data: {
        'lead_gen[promotion_id]': $('#lead_gen_promotion_id').val(),
        'lead_gen[name]': $('#lead_gen_name').val(),
        'lead_gen[email]': $('#lead_gen_email').val(),
      },
      type: 'POST',
      dataType: 'json',
      success: function(data) {
        console.log(data)
         $('#content').html(data.html);
      }
    });

Я вызываю validate, и моя форма пропускает проверку и сразу переходит к методу post. Я знаю, что validate () работает, потому что я использую событие для вызова проверок в строке.

$(document).ready(function(){
    $("#lead_gen_email").validate();
    console.log("testing validate")


    $("#lead_gen_email").validate({
       onkeyup: true
    })

  });
   }

Я что-то не так делаю? Как я могу это исправить?

Answer 1

Это потому, что вы прикрепили сообщение ajax к onClick.Он запускает ajax независимо от сценария проверки.Используйте что-то вроде

$('#yourlink').click(function(e){
 if (aVariableThatIndicatesPresenceOfErrors) {
  e.preventDefault()
 } else {
  submit_form(posturl)
 }

})

Конечно, эту переменную нужно будет как-то создать.Возможно, селектор с классом сообщений об ошибках?

var hasError = $('div.error').length;

Не уверен, что плагин validate имеет метод обратного вызова, который может свести на нет все это.

Answer 2

Вы можете использовать следующий код:

function submit_form(posturl) {
if ($("#targetFormId").valid()) {
$.ajax({
  url: '/create_lead',
  data: {
    'lead_gen[promotion_id]': $('#lead_gen_promotion_id').val(),
    'lead_gen[name]': $('#lead_gen_name').val(),
    'lead_gen[email]': $('#lead_gen_email').val(),
  },
  type: 'POST',
  dataType: 'json',
  success: function(data) {
    console.log(data)
     $('#content').html(data.html);
  }
}
});

Замените "targetFormId" на идентификатор вашей формы

Answer 3

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