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

Question

我有以下表格和jquery验证。

1. 当我提交表单而不输入任何值时，它会显示错误消息。但是当我在“Amount”文本框中输入值时，两个错误消息都消失了。

2. 此外，在此之后，当我清除Amount文本框中的值时，只有“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;
  }
});

Answer 1

  

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

来自the documentation for showErrors：

  

参数包含仅那些当前验证的元素，在执行验证时可以单个元素 onblur 在focusout或keyup。

如您所见，showErrors选项按设计运行。新验证完成后，新的map消息不会保留先前的消息。如果验证了一个字段，则映射仅包含一个字段的消息等。

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

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

DEMO：jsfiddle.net/y9o8du3q/