~ overflow ~

Problem:

How to validate twitter @your_crap_name using jQuery’s validator plugin?

Solution:

jQuery.validator.addMethod("twitter", function(twitter, element) {
	return this.optional(element) || twitter.match(/^@+\b[A-Z0-9._%-]+\b/i);
}, "Twitter inválido");

Problem:

How to programatically validade a single non keyup field with jquery validator?

Solution:

$("input[name=YOUR_FIELD_NAME]").valid()

Problem:

Highlighting a checkbox or radio button on error with jquery’s validator plugin is not a good idea, specially if you’re adding borders , backgrounds or something like, since it’s NOT supported over all browsers. I have a little bar around them that goes red if something is wrong, however, it’s not possible to add it if there’s many elements, so it’s better add a wrapper element and style it, in my case i added an element which ID is the same of input NAME, a little change on the plugin make things automatic.

Solution:

		highlight: function( element, errorClass, validClass ) {
			$(element).addClass(errorClass).removeClass(validClass);
			if (($(element).attr("type") == "radio" || $(element).attr("type") == "checkbox") && $("#"+$(element).attr("name")).length > 0)
				$("#"+$(element).attr("name")).addClass(errorClass).removeClass(validClass);
		},
		unhighlight: function( element, errorClass, validClass ) {
			$(element).removeClass(errorClass).addClass(validClass);
			if (($(element).attr("type") == "radio" || $(element).attr("type") == "checkbox") && $("#"+$(element).attr("name")).length > 0)
				$("#"+$(element).attr("name")).removeClass(errorClass).addClass(validClass);
		}