jQuery Validation errorPlacement

Question

This works:

$("[id$='_zzz']").rules(
    "add",
    {
        required: true,
        minlength: 8,
        messages: {
            required: "...",
            minlength: jQuery.format("...")
        }            
    }
);

The error message comes up.

When I try to style the message, this doesn't work:

$("[id$='_zzz']").rules(
    "add",
    {
        required: true,
        minlength: 8,
        messages: {
            required: "...",
            minlength: jQuery.format("...")
        },
        errorElement: "span",
        errorPlacement: function(error, element) {
            error.insertAfter(element);
            error.css("margin", "0 0 0 5px");
        }             
    }
);

When I style via the validate function, the styling is applied so it works:

$('#aspnetForm').validate({
    errorElement: "span",
    errorPlacement: function(error, element) {
        error.insertAfter(element);
        error.css("margin", "0 0 0 5px");
    }
});

Why can't I style using errorplacement in the rules add function?

OK, I can confirm that the styling works on a simple page (using jquery1.4/validate) - there doesn't appear to be anything wrong with styling it at the same time ... give me a minute. — amelvin
– amelvin, Commented Apr 23, 2010 at 14:39
Sorry unexpected influx of work, I'll look at it tonight - but someone will probably have solved it by then! — amelvin
– amelvin, Commented Apr 23, 2010 at 16:00
No problem. I can style the messages using validate, this is more of a why question in terms of why can't I do it with the rules function. — Steve
– Steve, Commented Apr 23, 2010 at 16:24

Nick Craver · Accepted Answer · 2010-04-24 00:47:13Z

In the first method, you're passing a errorPlacement property/function on the object to the rules method...it simply doesn't care of check for this and doesn't use it. For any object you pass in to javascript it has to check for that property or make use of it in some manner, otherwise it's just extraneous information. You could add myExtrathing:'ValueHere' to the object as well, wouldn't break anything...but wouldn't be used either.

The .validate() method has an existing errorPlacement function (that is actively uses, that's the important part, it's looking for it) in the default options and performs an extend to replace the default method with the one your provided...if you provided one. This same behavior is true for almost every jQuery plugin and any option you specify, it merges the default options with the ones you provide/override. You can see some simple examples of this behavior in the jQuery plugin authoring manual.

Collectives™ on Stack Overflow

jQuery Validation errorPlacement

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related