We Keep Coding

Jquery validate plugin change default message

How can I change the default require message in Jquery validation plugin. I have tried the following, but it still prints the default message:
$("#form1").validate({
ignore: [],
debug: false,
rules: {
firstName: {
required: true,
minlength: 2,
maxlength: 200
}
message: {
firstName:{
required: "Custom error message."
}
}
}
});
});
UPDATE
I change my message into messages
messages: {
firstName:"Custom error message."
}

$("#form1").validate({
ignore: [],
debug: false,
rules: {
firstName: {
required: true,
minlength: 2,
maxlength: 200
},
messages: {
firstName:{
required: "Firstname required",
minlength: "Min length is 2",
maxlength: "Max length is 200",
}
}
}
});

show alert highlights for jQuery validation in bootstrap 3 tabs

I validate my form in bootstrap tabs using jquery validation plugin like this :
JS:
$(document).ready(function () {
$("form[name=modify]").validate({
highlight: function (label) {
$(label).closest('.form-group').addClass('has-error');
var fieldset = $(label).parent().parent().parent().parent().parent().parent().parent();
if ($(fieldset).find("fieldset.tab-pane.active:has(div.has-error)").length == 0) {
$(fieldset).find("fieldset.tab-pane:has(div.has-error)").each(function (index, tab) {
var id = $(tab).attr("id");
$('a[href="#' + id + '"]').tab('show');
});
}
},
debug: true,
ignore: [],
rules: {
first_name: {
required: true,
},
surname: {
required: true
},
id_number: {
required: true
},
mobile_number: {
number: true,
minlength: 10,
},
home_number: {
number: true,
minlength: 10,
},
other_contact: {
number: true,
minlength: 10,
},
line1: {
required: true,
},
city_town: {
required: true,
},
postal_code: {
required: true,
minlength: 4,
},
curr_renumeration: {
required: true,
number: true,
},
expect_renumeration: {
required: true,
number: true
},
email: {
email: true,
required: true,
},
}
});
$("[type=submit]").submit(function (e) {
e.preventDefault();
});
});
in action jquery validation plugin worked and validate all tabs and show error bottom of each input. i need to show alert Or highlight title of tabs (ie : <a data-toggle="tab" href="#form3">Address Details</a>) if in tabs was a error.
how do can i show this alert or highlight error in title tabs
DEMO FIDDLE

errorPlacement can not be validate in first call but work fine in second click

using following function for validating but cant be work fine in first time but work fine in second time.
second function is used for validator and its not working fine when i first click the button but its work fine second time please help.
function saveValue(){
if (validateFormset().form()) { // validation perform
$('form#vendorActionForm').attr({methos: 'POST'});
$('form#vendorActionForm').attr({action: 'vendorAddressCreateUpdate.htm'});
$('form#vendorActionForm').submit();
}else{
$(".textMessgeClass").text("Please fill the highlighted field/s");
$(".textMessgeClass").addClass('errorClass');
$(".textMessgeClass").fadeIn("slow");
$(".textMessgeClass").delay(2000).fadeOut(2000);
}
}
function validateFormset(){
var validator = $("#vendorActionForm").validate({
rules: {
accountType: {
required:true
},
addressRank: {
required:true
},
street: {
required:true
},
city: {
required:true
},
state: {
required: true,
accept: "[a-zA-Z]+",
minlength: 2
},
region: {
required: true
},
zipCode: {
required: true,
rangelength: [3, 5]
},
contactName: {
required: true
},
mobile: {
required: false,
number: true,
minlength: 10
},
email: {
required: true,
email: true
},
email2: {
required: false,
email: true
},
email3: {
required: false,
email: true
}
},
errorPlacement: function(error, element) {
$(element).filter(':not(.valid)').addClass("addressErrorClass");
},
success: function(error) {
$("#vendorActionForm").find('.valid').removeClass("addressErrorClass");
}
});
alert('AAAA');
alert(validator);
return validator;
}

line up multiple objects having same data (reduce redundancy)

I am developing a web application and i have used jquery validation as :
$("#register").validate({
rules: {
emailID: {
required: true,
email: true
},
pass: {
required: true,
minlength: 6
},
user_email: {
required: true,
email: true
},
user_pass: {
required: true,
minlength: 6
}
}
everything is working but the problem is as object emailID and user_email both are having the same data also same for pass and user_pass, how can i line them in one without changing my name attribute in html, something like this :
$("#register").validate({
rules: {
emailID, user_email:
{
required: true,
email : true
}
}
i know this structure is not correct.
and as i am having lots of objects having same data, so it doesnt seems to be good doing the repetition

function RequiredRule( email, minlength ) {
this.email = email;
this.minlength = minlength;
this.required = true;
}
$("#register").validate({
rules: {
emailID: new RequiredRule(true),
pass: new RequiredRule(false, 6),
user_email: new RequiredRule(true),
user_pass: new RequiredRule(false, 6)
}
});

var one = {
required: true,
email: true
},
two = {
required: true,
minlength: 6
};
$("#register").validate({
rules: {
emailID: one,
pass: two,
user_email: one,
user_pass: two
}
});

Remote validation

below is my code the validation only works without the remote validation. once i include remote validation, it submit the form without completing all the other form validations?
$(document).ready(function() {
$("#form1").validate({
rules: {
firstName: "required",// simple rule, converted to {required:true}
lastName: "required",
email: {// compound rule
required: true,
email: true,
success: "valid",
remote: "checkAddress.php"
},
password: {
required: true,
success: "valid",
minlength: 5
},
verify: {
required: true,
success: "valid",
minlength: 5,
equalTo: "#password"
},
address1: "required",
city: "required",
province: "required",
dob: {
required: true,
date: true,
success: "valid"
},
captcha_code: {
required: true,
captcha_code: true,
remote: "checkCaptcha.php"
}
},
messages: {
email:{
remote: "This email is already registered! One registration per email address."
},
captcha_code:{
remote: "Enter the right captcha value!."
}
},
onsubmit: true
});
});

What I was asking was if you have implemented captcha_code as a method? in captcha_code: true,.
captcha_code: {
required: true,
captcha_code: true,
remote: "checkCaptcha.php"
}
Like this
jQuery.validator.addMethod("captcha_code", function(value, element) {
return (this.optional(element) || /* do something */ );
}, "");
I found this captcha demo and it has no captcha_code as method, only required and remote. So I was thinking if you have implemented it.
Here is the script from the demo. http://jquery.bassistance.de/validate/demo/captcha/
$(function(){
$("#refreshimg").click(function(){
$.post('newsession.php');
$("#captchaimage").load('image_req.php');
return false;
});
$("#captchaform").validate({
rules: {
captcha: {
required: true,
remote: "process.php"
}
},
messages: {
captcha: "Correct captcha is required. Click the captcha to generate a new one"
},
submitHandler: function() {
alert("Correct captcha!");
},
success: function(label) {
label.addClass("valid").text("Valid captcha!")
},
onkeyup: false
});
});

The remote URL is hit passing in the value of the field to which it’s expecting a JSON TRUE/FALSE in return, are you in this one?

so i changed:
email: {// compound rule
required: true,
email: true,
success: "valid",
remote: "checkAddress.php"
},
captcha_code: {
required: true,
captcha_code: true,
remote: "checkCaptcha.php"
}
to
email: {// compound rule
required: true,
remote: "checkAddress.php"
},
captcha_code: {
required: true,
remote: "checkCaptcha.php"
}
it works great, wow, you guys rock!!!