Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Dynamically change JSTree sort order

Tags:

jstree

I'm using JSTree to display a small Windows Explorer-like appearance, everything is perfect but I have to implement sorting option also, is there anyway that I can have my tree sorting order dynamically changed? For example I can have a button that allows user to sort contents based on name (asc or desc), size, change date or even type. How can I perform it? I think there is something wrong with JSTree sort plugin, or at least I cannot understand how it works!

This is what I do in order to change sort based on user interaction:

treeInst = $('#divWindowsExplorer').jstree(true);
var root = treeInst.get_node('j1_1');
$.jstree.defaults.sort = function (a, b) {
    return this.get_text(a) < this.get_text(b) ? -1 : 1;
};
$("#divWindowsExplorer").jstree(true).sort(root, true);
$("#divWindowsExplorer").jstree(true).redraw_node(root, true);
like image 489
Ali_dotNet Avatar asked Apr 20 '26 04:04

Ali_dotNet


1 Answers

Try with sort options.

  $("#plugins5").jstree({
     "plugins" : [ "sort" ],
     'sort' : function(a, b) {
        // you can do custom sorting here
        // based on your user action you can return 1 or -1
        // 1 show on top -1 for show bottom 
    }
  });

For more info click here

like image 102
Irfan Ali Avatar answered Apr 23 '26 22:04

Irfan Ali