How to execute jquery call on data returned with jquery $.post call

Question

I have a page that uses jquery to turn an html table into a file structure using jquery treeTable plug in. The html table is in a div called "treeStructure"

I have the ability to add a new folder to any folder in the tree and I use a post call to add the new folder to the database. The post returns a new html table, with the added folder and replaces the "treeStructure" div's contents with the returned data. I then want to use the jquery to turn that table into the file structure again (like i did in the $document.ready() ), with out refreshing the page.

I think I need to use Jquery's .live() feature, but I can not figure out how to do this.

Answer 1

If all you need is to register an event handler for elements which don't exist yet, replace

$('selector').click(function(e) { /* your code */ });

with

$('selector').live('click', function(e) { /* your code */ });

Answer 2

In the callback to your $.post call, you can run the plugin on the data returned.

$.post('some/path', {some:'data'}, function( resp ) {
       // create a jQuery object with the response
     var $resp = $(resp);
       // call the plugin
     $resp.treeTable();
       // append the result
     $resp.appendTo('wherever');
});

If the table is nested deeper inside the response, you'll need to do a find:

$resp.find('#myTable').treeTable();