Живая проверка, когда в форме отправляются и кнопка отмены

Question

У меня есть две кнопки в форме:

<input id="apply" type="submit" class="smgreen" name="apply" value="Apply">
<input id="cancel" type="submit" class="smred" name="cancel" value="Cancel">

и мне нужно проверить форму в реальном времени и по нажатию кнопки "Применить", но нет, когда я нажму кнопку "Отмена". Как мне это сделать?

Мой JS:

f = {};
$('.required').each(function() {
  var id = $(this).prop('id');
  f[id] = new LiveValidation(id, { validMessage: "ok", wait: 500 } );
  f[id].add( Validate.Presence, { failureMessage: "error" } );
});

Answer 1

Вы можете добавить событие обработчика в кнопку отправки, например:

$('#apply').click(function(){
 f = {};
 $('.required').each(function() {
   var id = $(this).prop('id');
   f[id] = new LiveValidation(id, { validMessage: "ok", wait: 500 } );
   f[id].add( Validate.Presence, { failureMessage: "error" } );
 });
});

Answer 2

Я бы посоветовал не делать кнопку "Отмена" кнопкой "отправить". Подумайте об этом... вы на самом деле ничего не отправляете, если хотите отменить.

Также, если вы настаиваете на наличии нескольких кнопок отправки, дайте им более общее имя:

<input id="apply"  type="submit" name="action" value="Apply" />
<input id="cancel" type="submit" name="action" value="Cancel" />

Что касается вашего JavaScript, не проверяйте при нажатии кнопки, а при отправке формы:

$('#myForm').on('submit', function(e) {
    e.preventDefault();

    // do validation stuff
    if( valid ) {
        $(this).submit();
    } else {
        // do something about your errors
    }
});