Michaël Michaël - 1 month ago 10
jQuery Question

Reload javascript file after an AJAX request

After the request, the new elements created are not recognized by the event handlers in my jQuery code.

Is there a way to reload the file to re-register these events?

Answer

I'm assuming that you mean that events you've registered for elements that have been replaced by with the results of your ajax requests aren't firing?

Use .live() (see http://api.jquery.com/live/) to register the events against elements that the match the selector (including the new DOM elements created from the results of the ajax), rather than the results of the selector when the event handlers were first, which will be destroyed when they are replaced.

e.g. replace

$('div.someClass').click(function(e){
    //do stuff
});

with

$('div.someClass').live('click', function(e){
    //do stuff
});

Important:

While I've recommended using .live() this is for clarity as its syntax is similar to .bind(), you should use .on() if possible. See links in @jbabey's comment for important information.