UnKnown UnKnown - 1 month ago 4
jQuery Question

On Click of Form Reset button , how to clear Jquery Validaton error messages?

I am using Jquery and bootstrap in combination .
I have got a Form with 2 components a text input and a file input .

Issue 1 :

Initially click on Submit button without doing anything in the form
and it doesn't clear the jquery Validation error messages on click of Reset Button .

Issue 2:

Enter some description under text input and upload any picture and on click of RESET Button it doesn't clear the input type file value .

This is my js code

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('');
});


This is my fiddle
http://jsfiddle.net/Luf0ks9b/48/

Answer

For your issue 1 you can use:

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

for reset the form.

For your issue 2 you can fire trigger click remove button like below:

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

DEMO

Comments