jstree | 易学教程

jsTree not working

阅读更多关于 jsTree not working

问题 I am new to jQuery and jsTree and I am not sure why I can't get it working? Using this tutorial: http://tkgospodinov.com/jstree-part-1-introduction/ And this html / javascript: <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta http-equiv="x-ua-compatible" content="ie=edge"> <meta name="description" content=""> <title> BLA BLA </title> <base href="/"> <meta name="viewport" content="width=device-width, initial-scale=1.0">

jsTree custom contextmenu not filtering based on type folder/file

阅读更多关于 jsTree custom contextmenu not filtering based on type folder/file

I am trying to configure a custom context menu for jsTree. I want files to have two options [Rename, Delete] and I want folders to have one option [Create] The below code seems correct as described here: Configuring jstree right-click contextmenu for different node types However this does not seem to work, there are two problems. Both context menus display the options [Rename, Delete] Choosing either option causes the error: Uncaught TypeError: undefined is not a function What am I doing wrong? Edit: here is a fiddle $( document ).ready(function() { function customMenu(node) { // The default

JSTree select_node event firing twice

阅读更多关于 JSTree select_node event firing twice

There is a select_node event I created. But its firing twice when we select a node. Here as you can see the alter I set on the select_node event Which is firing twice. Also in the JStree initialisation I specified a check event. $('#div_vocabulary_tree').on('select_node.jstree', function (e, data) { alert("Select Event"); }); This is my JStree initialization code $('#div_vocabulary_tree').jstree({ plugins: ["wholerow", "checkbox", "types", "search"], "search": { "case_insensitive": true }, 'checkbox': { three_state: false, // to avoid that fact that checking a node also check others whole_node

Disable JSTREE check box

阅读更多关于 Disable JSTREE check box

Just curious to know if there is any way in JSTREE to disable checkbox? I basically need to disable(not deselect) all my selected child nodes when I click on the parent node. You need to create a new type(disabled) for this. It can be done as follows "types" : { "types": { "disabled" : { "check_node" : false, "uncheck_node" : false } } } and then assign that type as .set_type("disabled", "#node5"); More documentation is here. For disabling all child nodes, create an event handler for the change_state event $("#treeElement").bind("change_state.jstree", function (e, d) { var node = d.args[0]; //

How do I get rid of recursive AJAX requests for a childless node?

阅读更多关于 How do I get rid of recursive AJAX requests for a childless node?

问题 Problem: According to the author, jsTree Documentation: When opening a closed node (that has no loaded children) an AJAX request is made. How do I configure jsTree to get rid of these AJAX data requests made for each empty/childless node? I want my empty nodes remain empty (or childless)! Given (simplified): JSON data container ( data.json ) { "data" : "Root node with no children", "children" : [] } jsTree configuration { "json_data" : { "ajax" : { "url" : "data.json", "type" : "GET",

How to listen for double-click on jstree?

阅读更多关于 How to listen for double-click on jstree?

问题 How would I write a listener for a double-click event on a jstree object? (For example, I'd like to double-click on a tree node and paste its anchor's href value into an input field in a form somewhere.) 回答1: I have used something like this way back a year ago, i don't know if there's any change in the current jstree version : jstree.bind("dblclick.jstree", function (event) { var node = $(event.target).closest("li"); var data = node.data("jstree"); // Do some action }); node : Contains the li

JsTree checkbox - check event

阅读更多关于 JsTree checkbox - check event

问题 I have this JsTree with this code: var Tree = $("#MyTree"); Tree.jstree({ "core": { "themes": { "responsive": false, "multiple" : false, }, "data": dataTree }, "types": { "default": { "icon": "icon-lg" }, "file": { "icon": "icon-lg" } }, "ui": { "select_limit": 1, }, "plugins": ["wholerow", "types", "checkbox", "ui", "crrm", "sort"], "checkbox": { "three_state": false, "real_checkboxes": false } }); I need to separate the selection and the check action, the user must check all node he wants

My Ajax call isn't working - Trying to populate jstree via ajax php & mysql JSON

阅读更多关于 My Ajax call isn't working - Trying to populate jstree via ajax php & mysql JSON

Javascript: $('#jstree1').jstree({ 'core' : { // I usually configure the plugin that handles the data first // This example uses JSON as it is most common "json_data" : { // This tree is ajax enabled - as this is most common, and maybe a bit more complex // All the options are almost the same as jQuery's AJAX (read the docs) "ajax" : { // the URL to fetch the data "type" : "POST", "url" : "./ajax/get_page_data.php", "dataType": "JSON", "contentType": "application/json;", "data": "d_id="+<?=$DOC['d_id']?>, "success" : function (data) { // 'data' is a JSON object which we can access directly. //

Click on jstree node, rebuild tree with that node as the root

阅读更多关于 Click on jstree node, rebuild tree with that node as the root

I think the subject is reasonably clear. :) I'm a jstree newbie and have tried to parse the docs, but I'm getting a bit stuck with this one. I have the following code: $("#tree").jstree({ "json_data" : { "data" : [ tree.company ] }, "themes" : { "theme" : "smb", "dots" : false, "icons" : true }, "plugins" : [ "themes", "json_data", "ui" ] }).bind("select_node.jstree", function (event, data) { $('#tree').jstree.refresh(data.inst.get_selected()); // FIXME }); The tree loads and displays just fine, but when I click on the node that I want to become the new root of the displayed tree, I get an

Delete all nodes in jsTree

阅读更多关于 Delete all nodes in jsTree

问题 Is there a way to clear out all nodes from a jsTree that's faster than walking through all the nodes deleting them one-by-one? 回答1: See the documentation here: http://www.jstree.com/documentation/core .delete_node ( node ) Removes a node. Triggers an event. mixed node This can be a DOM node, jQuery node or selector pointing to the element you want to remove. It seems you can just do a selector that will delete all the nodes you want, no loops required. 回答2: The simplest way I have found is to