Validate form added to DOM with jQuery validate

Quick question: How can I use good, old jQuery Validate to validate a form which gets added to the DOM (via Ajax) after the page has loaded?

$("form#su开发者_运维百科perForm").validate(options); doesn't work...

Thanks!

$("form#superForm").validate(options); does work. It's just that you're trying to attach it before the content (form#superForm) is loaded.

If you want it to work properly, you'll have to attach it after you've loaded it in. So, for example:

$('#somediv').load('path/to/ajax/that/returns/form#superForm', function() {
    $("form#superForm").validate(options);
});

$("form#superForm").validate(options); doesn't work...

It will work, you only have to call it once the form is added to the DOM which is in the success callback of your AJAX call. I suppose that you are calling it in document.ready when the form doesn't exist yet in the DOM.

For example:

$(function() {
    // when some button is clicked we load the form:
    $('.button').click(function() {
        // we send an AJAX request to load the form
        $.post('/somescript', function(result) {
            // the AJAX request succeeds and we inject the result into the DOM:
            $('#result').html(result);

            // now we can attach the validator:
            $('#superForm').validate(options);
        });
        return false;
    });
});