Javascript not working after jQuery ajax loads on parent document

In a top-bottom view, I'm trying to upload an image (in a target iFrame) trough a validated form (using jQuery-validate). After that the iFrame's PHP script that upload the image reloads the parent document to refresh the images list making an ajax load:

$('#content', window.parent.document).load(...);

After that, the parent document javascript code between tags doesn't work, so validated forms fails and when I submit the form again ju开发者_JS百科st take me to index.

Can any one help me with something?

Best regards from Spain

If your form is inside #content, you should consider overriding your form submit event if it does not submit properly and implementing actions you want performed in javascript. See http://api.jquery.com/submit/

For initializing validation on dynamically loaded elements, try this

    var element = "#content form";
    $(element).valid();
    $(element).find("input").each(function () {
        $(this).blur(function () {
            $(this).valid();
        });
    });
    $(element).find("select").each(function () {
        $(this).change(function () {
            $(this).valid();
        });
    });

If you are using unobtrusive validation, see http://xhalent.wordpress.com/2011/01/24/applying-unobtrusive-validation-to-dynamic-content/ and Validate dynamically added control

UPDATE: I forgot to mention, all javascript that you execute in $(document).ready function is executed on document load, and therefore is not executed on dynamically ajax loaded content, so if you need to attach datepicker etc, you must do it after loading content (in success function of $.ajax)