How to add jquery treeview callback on data load

I am using jquery treeview plugin. Is there any way to add a callback function that is going to be called after I load the data?

  $("#tree").treeview({
      url: "/loadtree",
      callback: my_function // this is wh开发者_如何转开发at i wanted to do
  });

There is no callback in the async treeview but it should be easy enough to add one of your own. The AJAX stuff is here:

https://github.com/jzaefferer/jquery-treeview/blob/master/jquery.treeview.async.js#L42

$.ajax($.extend(true, {
    url: settings.url,
    dataType: "json",
    data: {
        root: root
    },
    success: function(response) {
        child.empty();
        $.each(response, createNode, [child]);
        $(container).treeview({add: child});
    }
}, settings.ajax));

You can add a callback by adding settings.dataLoaded and changing the above snippet to something like this:

$.ajax($.extend(true, {
    url: settings.url,
    dataType: "json",
    data: {
        root: root
    },
    success: function(response) {
        if(settings.dataLoaded) 
            settings.dataLoaded();
        child.empty();
        $.each(response, createNode, [child]);
        $(container).treeview({add: child});
    }
}, settings.ajax));

I just added two lines beneath success:. Then you'd set up the treeview like this:

$("#tree").treeview({
    url: "/loadtree",
    dataLoaded: my_function
});

I haven't tried this but it should work and if not, it will be a good starting point for getting it going.

You have access to the source code, there's no good reason not to use it. And, there's no good reason not to add the callback support yourself and send Jörn Zaefferer a patch to get this functionality added to the main repository.

Adding the callback was really helpful - Thanks .

I found that you might want to change the order inside the treeview async source code.

    $.ajax($.extend(true, {
    url: settings.url,
    dataType: "json",
    data: {
        root: root
    },
    success: function(response) {
        child.empty();
        $.each(response, createNode, [child]);
        $(container).treeview({add: child});

            if(settings.dataLoaded) 
        settings.dataLoaded();

    }
}, settings.ajax));

This way the async script can finish modifying the DOM. Notice now settings.dataLoaded comes at the end of sucess:function.