微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

javascript – 如何使用JQuery Validate在单击提交按钮时创建一个包含所有表单错误的弹出窗口?

我正在使用JQuery Validation插件进行客户端表单验证.除了无效表单字段上的多彩样式之外,我的客户端还需要显示弹出消息.我只想在单击提交按钮时显示此消息,否则会导致用户疯狂.我尝试了以下代码,但errorList始终为空.任何人都知道做类似事情的正确方法.

function popupFormErrors(formId) {
  var validator = $(formId).validate();
  var message = '';
  for (var i = 0; i < validator.errorList.length - 1; i++) {
    message += validator.errorList[i].message + '\n';
  }

  if (message.length > 0) {
    alert(message);
  }
}

$('#btn-form-submit').click(function(){
  $('#form-register').submit(); 
  popupFormErrors('#btn-form-submit');
  return false;
});

$('#form-register').validate({
  errorPlacement: function(error,element) {/* no room on page */},highlight: function(element) { $(element).addClass('invalid-input'); },unhighlight: function(element) { $(element).removeClass('invalid-input'); },...
});

更新
从接受的答案中的信息我想出了这个.

var submitClicked = false;

$('#btn-form-submit').click(function() {
  submitClicked = true;
  $('#form-register').submit();    
  return false;
});

$('#form-register').validate({
  errorPlacement: function(error,showErrors: function(errorsObj) {
    this.defaultShowErrors();
    if (submitClicked) {
      submitClicked = false;
      ... create popup from errorsObj...
    }
  }
  ...
});
最佳答案
您应该真正考虑使用以下选项进行jQuery验证

showErrors

这是文档http://docs.jquery.com/Plugins/Validation/validate#options链接

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐