Prasath Vkl Prasath Vkl - 2 months ago 9x
jQuery Question

Jquery validation and scrolltop Not working

I have tried this jquery validation for registration page... When i click submit the error box shows..... I have two issues with this..

  • If i have focused on the input fields the error box were hided

  • Scrolltop was working.. But i want smoother scrolltop

var RegisterController = function () {
rules: {
first_name: "required",
email: {
required: true,
email: true,
remote: {
url: ajaxurl + 'user/availability',
type: "post",
email: function ()
return $('#email').val();
password1: {"required": true, minlength: 6},
password2: {"required": true, equalTo: "#password1"},
"day": "required",
"month": "required",
"year": "required"
messages: {
first_name: "Firstname is required",
email: {
required: "Email is required",
email: "Invalid Email",
remote: $.validator.format("{0} is already taken.")
password1: {
required: "Password is Required",
minlength: "Password Minimum length is 6 Characters"
password2: {
equalTo: "password Does not match",
required: "Confirm Password is required"
month: "Please Select month",
day: "Please Select day",
year: "Please Select year"
errorPlacement: function (error, element) {
showErrors: function (errorMap, errorList) {

if (submitted) {
var summary = '<h4>' + this.numberOfInvalids() ;
summary += '</ul></div>';
submitted = false;

//--> if you dont want to see the errors in line remove this below line?
invalidHandler: function (form, validator) {
submitted = true;
submitHandler: function (form) {
var formdata = global.FormData.serializeArrayToKeyPair($(form).serializeArray());
formdata['action'] = 'create';
global.CommonAjaxMethod.loadAjaxfunc(ajaxurl + 'register/ajax_request', 'POST', formdata, 'register_success');


For Smooth Animation :

 $('html, body').animate({scrollTop: '0px'}, 1200, 'linear');