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而言，不要按下按钮进行验证，而是在form-submit：

上进行验证

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

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

表单中的实时验证是提交和取消按钮

2 个答案: