JQuery Validate Custom Error messages in multiple places (top of form and at form level)

Question

I am using the JQuery Validate plugin to handle validation for my forms. I have a requirement to have the error at 2 places:

1. Top of the form
2. At the fi

Answer 1

Quote OP:

"so how would i build the code to have it at both locations?"

See the showErrors option as contained in the documentation.

This will give you a good start (needs some tweaking)...

$("#myform").validate({
    // your rules here,

    // call back for placement of messages within form
    errorPlacement: function (error, element) {
        error.insertBefore(element);
    },

    // callback for custom error display
    showErrors: function (errorMap, errorList) {

        // summary of number of errors on form
        var msg = "Your form contains " + this.numberOfInvalids() + " errors, see details below.<br/>"

        // loop through the errorMap to display the name of the field and the error
        $.each(errorMap, function(key, value) {
            msg += key + ": " + value + "<br/>";
        });

        // place error text inside box
        $("#errormessages").html(msg);

        // also show default labels from errorPlacement callback
        this.defaultShowErrors(); 

        // toggle the error summary box
        if (this.numberOfInvalids() > 0) {
            $("#errormessages").show();
        } else {
            $("#errormessages").hide();
        }

    } // end showErrors callback
});

Working DEMO: http://jsfiddle.net/M5pzA/