在一个文本框中输入值时,所有错误消息都会消失

All error messages disappear when value is entered on one textbox

我有以下表格 jquery 验证。

  1. 当我在没有输入任何值的情况下提交表单时,它会显示错误消息。但是当我在“金额”文本框中输入值时,两条错误消息都消失了。

  2. 此外,之后,当我清除金额文本框中的值时,只有 "Amount" 显示错误消息,直到我单击按钮。

如何解决这个问题?

Fiddle

jQuery代码

$("#formAddPayment").validate({
  rules: {
    "ddlModeOfPayment": {
      required: true
    },
    "txtAmount": {
      required: true
    }
  },
  messages: {
    "ddlModeOfPayment": {
      required: "Please select  Mode of Payment."
    },
    "txtAmount": {
      required: "Please enter Amount."
    }
  },

  showErrors: function (errorMap, errorList) {

    var errorListResult = $.map(errorList, function(error){
      return "<li>" + error.message+ "</li>";
    });

    $('#errorSummaryList').html(errorListResult.join(''))
    $('#errorSummaryList').fadeIn('fast');

    //Show error adjuscent to control also
    //this.defaultShowErrors();
  },
  submitHandler: function (form) {
    return false;
  }
});

All error messages disappear when value is entered on one textbox

来自the documentation for showErrors

The arguments contain only those elements currently validated, which can be a single element when doing validation onblur on focusout or keyup.

如您所见,showErrors 选项按设计工作。新的map条消息在新的验证完成后不保留之前的消息。如果验证了一个字段,则映射仅包含一个字段的消息等。

只需使用 wrapper and errorLabelContainer 选项,这些选项一起使用时旨在自动为整个表单保留更新的待处理消息列表...

wrapper: "li",  // <- the LABEL will be inside of this
errorLabelContainer: "#errorSummaryList",  // <- your UL element

演示:jsfiddle.net/y9o8du3q/