jquery - labelify + form validation

Soldato
OP
Joined
12 May 2007
Posts
3,891
Location
Bristol
The error is just because I stripped the page down to the form and put it on my personal server instead of the server it'll be running from.

Thanks for looking anyway though.
 

Pho

Pho

Soldato
Joined
18 Oct 2002
Posts
9,281
Location
Derbyshire
Right, I'm back from work now so I can be a bit more useful.

Setting 'focusInvalid : false' when you initialise validate does the same as what you did by modifying the validator code. It's much better to do it here to keep validate in its original form (and not effect other things which use the validator).

You can use invalidHandler to override what happens when the form is invalid. Here all I'm doing is using jQuery to de-select (blur) every input/textarea - I think what's happening is the validator is selecting all boxes you haven't filled in, and causing the labels to be removed as it was intended.

Full code:
PHP:
$(document).ready(function() {

	$("input:text, textarea").labelify();
	
	$("#form").validate({
		focusInvalid : false,
		rules: { 
			name: {
					required: true
			},
			email: {
					required: true,
					email: true
			},
			friendemailrequired: {
					required: true,
					email: true
			}			
        }, 
        messages: { 
            name: { 
                required: "Required"
            }, 
            email: { 
                required: "Required",
				email: "Required"
            },
            friendemailrequired: { 
                required: "Required",
				email: "Required"
            }			
        }, 
        // set this class to error-labels to indicate valid fields 
        success: function(label) { 
         // set   as text for IE 
        label.html(" ").addClass("checked");
        } ,
		invalidHandler: function(form, validator) {
				// deselect all textboxes
				$(":input, textarea").blur();
		}		
	})
});

You should also be able to revert jquery.validate.js back to the original, I've moved the logic above instead.
 
Top Bottom