Jquery: отправить функцию не работает при отправке формы

Question

У меня есть форма, которая мне нужно проверить с JQuery, чтобы увидеть, если некоторые поля пусты или нет, но когда я представить его с помощью этой функции:

$("#servicio-tecnico-1").submit(function(event) { 
     return validar_form(); 
}); 

Когда я отправляю функцию, она ничего не делает и отправляет форму также с пустыми полями. ¿Как я могу заставить его работать?

На всякий случай я сделал JSFiddle здесь

https://jsfiddle.net/ricardojriosr/hr97240j/1/

Спасибо заранее

Answer 1

Проблема у вас есть 2 переменных i и j, которые объявлены в внутренней функции, которая бросает ошибку при использовании вне внутренней функции

$("#servicio-tecnico-1").submit(function (event) { 
    var valid = validar_form(); 
    return valid; 
}); 

затем

var i = 0; 
$('.vfb-radio').each(function() { 
    if ($(this).is(':checked')) { 
     i = i + 1; 
    } 
}); 
var j = 0; 
$('.vfb-checkbox').each(function() { 
    if ($(this).is(':checked')) { 
     j = j + 1; 
    } 
}); 

В приведенном выше фрагменте i/j были внутри цикла each, и это было используется вне цикла

Демо: Fiddle

---

Но те 2 набор кодов может быть упрощена

var i = $('.vfb-radio:checked').length; 
var j = $('.vfb-checkbox:checked').length; 

Демо: Fiddle

Answer 2

Вы можете использовать JQuery Validate для выполнения проверки, а затем представить. Более подробная информация @http://jqueryvalidation.org/validate/

$(".selector").validate({ 
submitHandler: function(form) { 
// do other things for a valid form 
form.submit(); 
} 
}); 

Answer 3

$("#servicio-tecnico-1").submit(function(event) { 

if (validar_form() === true) { 
    //form is valid now submit it 
    return; 
    } 
else { 
     // prevent form submittal maybe return an error 
     event.preventDefault(); 
} 
}); 

Answer 4

Вы можете использовать плагин например jqueryvalidation Это хорошо документированный документ mented. И демо here, включая переключатели.