Using jsTree on a dynamically loaded page

[arip...@schottel.de]

Hello,

I want to create an ASP.NET MVC 5 application that uses jsTree. I am using ASP.NET AJAX to dynamically load a page during runtime. Where can I initialize jsTree on the dynamically loaded partial view?

When I start the web application everything is ok. I see the tree like this:

But now I click on 'Change Tree View' and a partial view is loaded via an Ajax.ActionLink. Now the tree will not be rendered as a TreeView but only as a normal list:

You can initialize the tree like this:

$('#treeView').jstree();

How can I initialize the TreeView for the partial view that is dynamically loaded? I tried the OnComplete callback function of the Action Link but that did not work.

The page on which I want to use the tree view is dynamically loaded via Ajax. Is something missing?

You can find more code on Stackoverflow:

https://stackoverflow.com/questions/29406628/how-can-i-initialize-jstree-on-a-dynamically-loaded-asp-net-mvc-partial-view-tha

Greetings

Alexander

[Ivan Bozhanov]

I am not familiar with the way .net updates partial views, but my guess is it simply swaps the HTML, but since the instance is already created on the parent, the second init call does nothing. Try using this:
function TreeViewChangeOnComplete() {
    $('#treeView').jstree(true).destroy(true);
    $('#treeView').jstree();
}

I posted the same on stackoverflow.

Best regards,
Ivan