How to make jstree empty on initialization?

Question

On click of a button I send some key to controllerand get my lists using json , the array inside my lists acts as my children in my jstree,

 $("#btnSearch").on("click", function () {
        alert("I'm also here");
        $.ajax({
            type: "POST",
            url: "/Claims/JSTree",
            success: function (response) {

                var clients = [];
                var claimKeys = [];
                $.each(response.ClientNames, function (i, item) {
                    clients.push(item);
                });
                alert(clients);
                $.each(response.ClaimNumbers, function (i, item) {
                    claimKeys.push(item);
                });
                alert(claimKeys);
                $('#FolderTree').jstree({
                    'core': {
                        'data': [
                           {
                               'text': 'Client',
                               'state': {
                                   'opened': false,
                                   'selected': false
                               },
                               'children': clients
                           },
                            {
                                'text': 'Claim key',
                                'state': {
                                    'opened': false,
                                    'selected': false
                                },
                                'children': claimKeys
                            },                               
                         ]
                    },
                    "plugins": ["checkbox"]
                });
            }
        });
    });
});

Everything works fine for the first time, when second time I pass a different key I get the lists, it even shows the values in alert, but my jstree still retains the previous values..Unless I stop and restart debugging, jstree doesn't become empty..Is there a way to empty jstree before populating it with children??

This anwser may help you: http://stackoverflow.com/questions/6836588/recreate-entire-jstree-instance-with-new-json-data — Radonirina Maminiaina, May 18 '15 at 12:13
Keep in mind the above question is for a very old jstree version (v1) and you are using v.3 — vakata, May 18 '15 at 13:15

score 3 · Accepted Answer · answered May 18 '15 at 13:16

3

Try using this code, which first destroys the instance:

...
var tmp = $('#FolderTree').jstree(true);
if(tmp) { tmp.destroy(); }
$('#FolderTree').jstree({ ...

Also make sure you are using the latest jsTree version.

answered May 18 '15 at 13:16

vakata

3,726
1
17
31

How to make jstree empty on initialization?

1 Answers1