CODEWITHSUNDEEP
javascriptjqueryhtmlcss
Partha Kalita
Partha Kalita

Reputation: 51

Jstree issue- executes only once

I have created a simple js page and a html page: I want to get a jstree structure when i click on the button. I am getting the structure on the first click.. However When i click once more it gives me a normal structure.. Is this a jstree bug... Please help

Html code:

<body><button id="idClickMe">Click me</button><div id='jstree'></div></body>

Js code

$(document).ready(function(){ 
    $('#idClickMe').click(function(){ 
        var resultant="<ul><li data-jstree='{'selected' : true, 'opened' : true }><span>Friend</span><ul><li>abc</li></ul></li><li><span>Wife</span></li><li><span>Company</span></li></ul>";
        $("#jstree").html(resultant);
        $("#jstree").jstree(); 
        //$("#jstree").jstree("refresh");
    }); 
});

Upvotes: 2

Views: 74

Answers (1)

rrk
rrk

Reputation: 15846

You need to destroy the tree before HTML change and recall.

DEMO

$('#idClickMe').on('click',function () {
    var resultant = "<ul><li data-jstree='{'selected' : true, 'opened' : true }><span>Friend</span><ul><li>abc</li></ul></li><li><span>Wife</span></li><li><span>Company</span></li></ul>";
    $("#jstree").jstree('destroy').html(resultant);
    $("#jstree").jstree();
});

Upvotes: 1

Related Questions