Using the jQuery Validation Engine with modal & dialog plugins

This is a question I often get asked by email, and I think there is enough requests to warrant a small blog post.

All about the DOM

The validationEngine expect your form to be present on the page when you initialize the plugin, and this is where modal plugins fall short. If your using those plugins you generally want to load a new piece of html into your document using AJAX.

In that case you need to initialize the validationEngine after you loaded your modal content. Generally modal plugins have an api that let you do this. Let’s take 2 example, Colorbox and jQuey ui.

Colorbox :

jQuery UI :

That should give you a pretty good idea of what you need to do whatever the…