Question

我正在组合使用Jquery和bootstrap。我有一个带有2个组件的表单，一个文本输入和一个文件输入。

问题1：

最初点击“提交”按钮，而不在表单中执行任何操作并且单击“重置按钮”时，它不会清除jquery验证错误消息。

问题2：

在文字输入下输入一些说明并上传任何图片，然后点击重置按钮，它不会清除输入类型文件值。

这是我的js代码

jQuery(document).ready(function(){
  $('#pacinsertform').validate(
    {
      rules:
      {
        previewpic:
        {
          required: true
        },
        description:
        {
          required: true
        }
      },
      messages:
      {
        previewpic:
        {
          required: "Upload Image required",
        },
        description:
        {
          required: "description  required",
        }
      },
      highlight: function(element)
      {
        $(element).parent().addClass('error')
      },
      unhighlight: function(element)
      {
        $(element).parent().removeClass('error')
      },
      submitHandler: function(event, validator)
      {
        if ($("#pacinsertform").valid())
        {
          ajaxInsertPac();
          return false;
        }
      }
    });

});
$("#previewpic").change(function()
                        {
  $("#previewpic").blur().focus();
});



function ajaxInsertPac()
{
  alert('ajax call heer');
  return false;
}
$(document).on("click", ".removepic", function(event)
               {
  $("#previewpic").attr('name', 'previewpic');
});
$(document).on("click", ".resetform", function(event)
               {
  $("#description").val('');
  $("#previewpic").val('');
});

这是我的小提琴 http://jsfiddle.net/Luf0ks9b/48/

Answer 1

要在重置时删除jquery验证消息，请使用：$("label.error").html('');

要重置重置按钮上的文件上传控件：$(".removepic").trigger('click');

请查看工作演示：http://jsfiddle.net/Luf0ks9b/53/

Answer 2

对于您的问题1，您可以使用：

$("#pacinsertform").validate().resetForm();

重置表单。

对于您的问题2，您可以触发触发点击删除按钮，如下所示：

$(".removepic").trigger( "click" );

DEMO

单击表单重置按钮，如何清除Jquery Validaton错误消息？

2 个答案: