jqtree 1.8.2 → 1.8.4

package/docs/_entries/node/getdata.md

@@ -1,17 +0,0 @@
----
-title: getData
-name: node-functions-getdata
----
-
-**function getData(includeParent = false);**
-
-Get the subtree of this node.
-
-**includeParent**
-
-* **true**: include node and children
-* **false**: only include children (default)
-
-{% highlight js %}
-var data = node.getData();
-{% endhighlight %}

package/docs/_entries/node/getlevel.md

@@ -1,13 +0,0 @@
----
-title: getLevel
-name: node-functions-getlevel
----
-
-Get the level of a node. The level is distance of a node to the root node.
-
-{% highlight js %}
-var node = $('#tree1').tree('getNodeById', 123);
-
-// result is e.g. 2
-var level = node.getLevel();
-{% endhighlight %}

package/docs/_entries/node/getnextnode.md

@@ -1,12 +0,0 @@
----
-title: getNextNode
-name: node-functions-getnextnode
----
-
-Get the next node in the tree. This is the next sibling, if there is one. Or, if there is no next sibling, a node further down in the tree.
-
--   Returns a node or null.
-
-{% highlight js %}
-const nextNode = node.getNextNode();
-{% endhighlight %}

package/docs/_entries/node/getnextsibling.md

@@ -1,10 +0,0 @@
----
-title: getNextSibling
-name: node-functions-getnextsibling
----
-
-Get the next sibling of this node. Returns a node or null.
-
-{% highlight js %}
-const nextSibling = node.getNextSibling();
-{% endhighlight %}

package/docs/_entries/node/getnextvisiblenode.md

@@ -1,15 +0,0 @@
----
-title: getNextVisibleNode
-name: node-functions-getnextvisiblenode
----
-
-Get the next visible node in the tree. Does the same as using the _down_ key.
-
-This is the previous sibling, if there is one. Or, if there is no previous sibling, a node further up in the tree that is visible.
-
--   Returns a node or null.
--   A node is visible if all its parents are open.
-
-{% highlight js %}
-const nextNode = node.getNextVisibleNode();
-{% endhighlight %}

package/docs/_entries/node/getpreviousnode.md

@@ -1,12 +0,0 @@
----
-title: getPreviousNode
-name: node-functions-getpreviousnode
----
-
-Return the previous node in the tree. This is the previous sibling, if there is one. Or, if there is no previous sibling, a node further up in the tree.
-
--   Returns a node or null.
-
-{% highlight js %}
-const previousNode = node.getPreviousNode();
-{% endhighlight %}

package/docs/_entries/node/getprevioussibling.md

@@ -1,10 +0,0 @@
----
-title: getPreviousSibling
-name: node-functions-getprevioussibling
----
-
-Get the previous sibling of this node. Returns a node or null.
-
-{% highlight js %}
-const previousSibling = node.getPreviousSibling();
-{% endhighlight %}

package/docs/_entries/node/getpreviousvisiblenode.md

@@ -1,15 +0,0 @@
----
-title: getPreviousVisibleNode
-name: node-functions-getpreviousvisiblenode
----
-
-Get the previous visible node in the tree. Does the same as using the _up_ key.
-
-This is the previous sibling, if there is one. Or, if there is no previous sibling, a node further up in the tree that is visible.
-
--   Returns a node or null.
--   A node is visible if all its parents are open.
-
-{% highlight js %}
-const previousNode = node.getPreviousVisibleNode();
-{% endhighlight %}

package/docs/_entries/node/index.md

@@ -1,13 +0,0 @@
----
-title: Node functions
-name: node-functions
-section: true
----
-
-You can access a node using for example [getNodeById](#functions-getnodebyid) function:
-
-{% highlight js %}
-var node = $('#tree1').tree('getNodeById', 123);
-{% endhighlight %}
-
-The Node object has the following properties and functions:

package/docs/_entries/node/parent.md

@@ -1,10 +0,0 @@
----
-title: parent
-name: node-functions-parent
----
-
-You can access the parent of a node using the **parent** property.
-
-{% highlight js %}
-var parentNode = node.parent;
-{% endhighlight %}

package/docs/_entries/options/animationspeed.md

@@ -1,7 +0,0 @@
----
-title: animationSpeed
-name: options-animationspeed
----
-
-Determine the speed of the slide animation. The value can be a number in millseconds, or a string like 'slow' or 'fast'. The default is 'fast'.
-

package/docs/_entries/options/autoescape.md

@@ -1,6 +0,0 @@
----
-title: autoEscape
-name: options-autoescape
----
-
-Determine if text is autoescaped. The default is true.

package/docs/_entries/options/autoopen.md

@@ -1,28 +0,0 @@
----
-title: autoOpen
-name: options-autoopen
----
-
-Open nodes initially.
-
-* **true**: open all nodes.
-* **false (default)**: do nothing
-* **n**: open n levels
-
-Open all nodes initially:
-
-{% highlight js %}
-$('#tree1').tree({
-    data: data,
-    autoOpen: true
-});
-{% endhighlight %}
-
-Open first level nodes:
-
-{% highlight js %}
-$('#tree1').tree({
-    data: data,
-    autoOpen: 0
-});
-{% endhighlight %}

package/docs/_entries/options/buttonleft.md

@@ -1,12 +0,0 @@
----
-title: buttonLeft
-name: options-buttonleft
----
-
-Set the position of the toggle button; can be `true` (left) or `false` (right). The default is `true`.
-
-{% highlight js %}
-$('#tree1').tree({
-    buttonLeft: false
-});
-{% endhighlight %}

package/docs/_entries/options/closedicon.md

@@ -1,26 +0,0 @@
----
-title: closedIcon
-name: options-closedicon
----
-
-A character or symbol to display on closed nodes. The default is '►' (►)
-
-The value can be a:
-
--   **string**. E.g. a unicode character or a text.
-    -   The text is escaped.
--   **html element**. E.g. for an icon
--   **JQuery element**. Also for an icon
-
-{% highlight js %}
-// String
-$('#tree1').tree({ closedIcon: '+' });
-
-// Html element
-const icon = document.createElement("span");
-icon.className = "icon test";
-$('#tree1').tree({ closedIcon: icon });
-
-// JQuery element
-$('#tree1').tree({ closedIcon: $('<span class="icon test" />') });
-{% endhighlight %}

package/docs/_entries/options/data-url.md

@@ -1,45 +0,0 @@
----
-title: dataUrl
-name: options-data-url
----
-
-Load the node data from this url.
-
-{% highlight js %}
-$('#tree1').tree({
-   dataUrl: '/example_data.json'
-});
-{% endhighlight %}
-
-You can also set the **data-url** attribute on the dom element:
-
-{% highlight html %}
-<div id="tree1" data-url="/example_data.json"></div>
-<script>
-    $('#tree1').tree();
-</script>
-{% endhighlight %}
-
-You can set additional [jquery ajax options](http://api.jquery.com/jQuery.ajax/) in an object:
-
-{% highlight js %}
-$('#tree1').tree({
-   dataUrl: {
-       url: '/example_data.json',
-       headers: {'abc': 'def'}
-   }
-});
-{% endhighlight %}
-
-Or you can use a function:
-
-{% highlight js %}
-$('#tree1').tree({
-   dataUrl: function(node) {
-       return {
-           url: '/example_data.json',
-           headers: {'abc': 'def'}
-       };
-   }
-});
-{% endhighlight %}

package/docs/_entries/options/data.md

@@ -1,46 +0,0 @@
----
-title: data
-name: options-data
----
-
-Define the contents of the tree. The data is a nested array of objects. This option is required.
-
-It looks like this:
-
-{% highlight js %}
-var data = [
-    {
-        name: 'node1',
-        children: [
-            { name: 'child1' },
-            { name: 'child2' }
-        ]
-    },
-    {
-        name: 'node2',
-        children: [
-            { name: 'child3' }
-        ]
-    }
-];
-$('#tree1').tree({data: data});
-{% endhighlight %}
-
-* **name**: name of a node (required)
-    * Note that you can also use `label` instead of `name`
-* **children**: array of child nodes (optional)
-* **id**: int or string (optional)
-    * Must be an int or a string
-    * Must be unique in the tree
-    * The `id` property is required if you use the multiple selection feature
-
-You can also include other data in the objects. You can later access this data.
-
-For example, to add an id:
-
-{% highlight js %}
-{
-    name: 'node1',
-    id: 1
-}
-{% endhighlight %}

package/docs/_entries/options/datafilter.md

@@ -1,17 +0,0 @@
----
-title: dataFilter
-name: options-datafilter
----
-
-Process the tree data from the server.
-
-{% highlight js %}
-$('#tree1').tree({
-    dataUrl: '/my/data/',
-    dataFilter: function(data) {
-        // Example:
-        // the server puts the tree data in 'my_tree_data'
-        return data['my_tree_data'];
-    }
-});
-{% endhighlight %}

package/docs/_entries/options/draganddrop.md

@@ -1,18 +0,0 @@
----
-title: dragAndDrop
-name: options-draganddrop
----
-
-Turn on dragging and dropping of nodes.
-
-* **true**: turn on drag and drop
-* **false (default)**: do not allow drag and drop
-
-Example: turn on drag and drop.
-
-{% highlight js %}
-$('#tree1').tree({
-    data: data,
-    dragAndDrop: true
-});
-{% endhighlight %}

package/docs/_entries/options/index.md

@@ -1,6 +0,0 @@
----
-title: Tree options
-name: tree-options
-section: true
----
-

package/docs/_entries/options/keyboardsupport.md

@@ -1,14 +0,0 @@
----
-title: keyboardSupport
-name: options-keyboardsupport
----
-
-Enable or disable keyboard support. Default is enabled.
-
-Example: disable keyboard support.
-
-{% highlight js %}
-$('#tree1').tree({
-    keyboardSupport: false
-});
-{% endhighlight %}

package/docs/_entries/options/oncanmove.md

@@ -1,22 +0,0 @@
----
-title: onCanMove
-name: options-oncanmove
----
-
-You can override this function to determine if a node can be moved.
-
-{% highlight js %}
-$('#tree1').tree({
-    data: data,
-    dragAndDrop: true,
-    onCanMove: function(node) {
-        if (! node.parent.parent) {
-            // Example: Cannot move root node
-            return false;
-        }
-        else {
-            return true;
-        }
-    }
-});
-{% endhighlight %}

package/docs/_entries/options/oncanmoveto.md

@@ -1,22 +0,0 @@
----
-title: onCanMoveTo
-name: options-oncanmoveto
----
-
-You can override this function to determine if a node can be moved to a certain position.
-
-{% highlight js %}
-$('#tree1').tree({
-    data: data,
-    dragAndDrop: true,
-    onCanMoveTo: function(movedNode, targetNode, position) {
-        if (targetNode.isMenu) {
-            // Example: can move inside menu, not before or after
-            return (position == 'inside');
-        }
-        else {
-            return true;
-        }
-    }
-});
-{% endhighlight %}

package/docs/_entries/options/oncanselectnode.md

@@ -1,26 +0,0 @@
----
-title: onCanSelectNode
-name: options-oncanselectnode
----
-
-You can set a function to override if a node can be selected. The function gets a node as parameter, and must return true or false.
-
-For this to work, the option 'selectable' must be 'true'.
-
-{% highlight js %}
-// Example: nodes with children cannot be selected
-$('#tree1').tree({
-    data: data,
-    selectable: true
-    onCanSelectNode: function(node) {
-        if (node.children.length == 0) {
-            // Nodes without children can be selected
-            return true;
-        }
-        else {
-            // Nodes with children cannot be selected
-            return false;
-        }
-    }
-});
-{% endhighlight %}

package/docs/_entries/options/oncreateli.md

@@ -1,22 +0,0 @@
----
-title: onCreateLi
-name: options-oncreateli
----
-
-The function is called for each created node. You can use this to define extra html.
-
-The function is called with the following parameters:
-
-* **node**: Node element
-* **$li**: Jquery li element
-* **isSelected**: is the node selected (true/false) 
-
-{% highlight js %}
-$('#tree1').tree({
-    data: data,
-    onCreateLi: function(node, $li, isSelected) {
-        // Add 'icon' span before title
-        $li.find('.jqtree-title').before('<span class="icon"></span>');
-    }
-});
-{% endhighlight %}

package/docs/_entries/options/ondragmove.md

@@ -1,20 +0,0 @@
----
-title: onDragMove
-name: options-ondragmove
----
-
-Function that is called when a node is dragged **outside** the tree. This function is called while the node is being dragged.
-
-* Also see the ``onDragStop`` option.
-* The function signature is function(node, event);
-
-{% highlight js %}
-function handleMove(node: Node, e: JQueryEventObject) {
-    //
-}
-
-$tree.tree({
-    dragAndDrop: true,
-    onDragMove: handleMove,
-});
-{% endhighlight %}

package/docs/_entries/options/ondragstop.md

@@ -1,20 +0,0 @@
----
-title: onDragStop
-name: options-ondragstop
----
-
-Function that is called when a node is dragged **outside** the tree. This function is called when user stops dragging.
-
-* Also see the ``onDragMove`` option.
-* The function signature is function(node, event);
-
-{% highlight js %}
-function handleStop(node: Node, e: JQueryEventObject) {
-    //
-}
-
-$tree.tree({
-    dragAndDrop: true,
-    onDragStop: handleMove,
-});
-{% endhighlight %}

package/docs/_entries/options/onismovehandle.md

@@ -1,17 +0,0 @@
----
-title: onIsMoveHandle
-name: options-onismovehandle
----
-
-You can override this function to determine if a dom element can be used to move a node.
-
-{% highlight js %}
-$('#tree1').tree({
-    data: data,
-    onIsMoveHandle: function($element) {
-        // Only dom elements with 'jqtree-title' class can be used
-        // as move handle.
-        return ($element.is('.jqtree-title'));
-    }
-});
-{% endhighlight %}

package/docs/_entries/options/onloadfailed.md

@@ -1,15 +0,0 @@
----
-title: onLoadFailed
-name: options-onloadfailed
----
-
-When loading the data by ajax fails, then the option **onLoadFailed** is called.
-
-{% highlight js %}
-$('#tree1').tree({
-    dataUrl: '/my/data/',
-    onLoadFailed: function(response) {
-        //
-    }
-});
-{% endhighlight %}

package/docs/_entries/options/onloading.md

@@ -1,22 +0,0 @@
----
-title: onLoading
-name: options-onloading
----
-
-The onLoading parameter is called when the tree data is loading. This gives us the opportunity to display a loading signal.
-
-Callback looks like this:
-
-```js
-function (isLoading, node, $el)
-```
-
-* **isLoading**: boolean
-  * true: data is loading
-  * false: data is loaded
-* **node**:
-  * Node: if a node is loading
-  * null: if the tree is loading
-* **$el**:
-  * if a node is loading this is the `li` element
-  * if the tree is loading is the `ul` element of the whole tree

package/docs/_entries/options/openedicon.md

@@ -1,26 +0,0 @@
----
-title: openedIcon
-name: options-openedicon
----
-
-A character or symbol to display on opened nodes. The default is '▼' (▼)
-
-The value can be a:
-
--   **string**. E.g. a unicode character or a text.
-    -   The text is escaped.
--   **html element**. E.g. for an icon
--   **JQuery element**. Also for an icon
-
-{% highlight js %}
-// String
-$('#tree1').tree({ openedIcon: '-' });
-
-// Html element
-const icon = document.createElement("span");
-icon.className = "icon test";
-$('#tree1').tree({ openedIcon: icon });
-
-// JQuery element
-$('#tree1').tree({ openedIcon: $('<span class="icon test" />') });
-{% endhighlight %}

package/docs/_entries/options/openfolderdelay.md

@@ -1,15 +0,0 @@
----
-title: openFolderDelay
-name: options-openfolderdelay
----
-
-Set the delay for opening a folder during drag-and-drop. The delay is in milliseconds. The default is 500 ms.
-
-* Setting the option to `false` disables opening folders during drag-and-drop. 
-
-{% highlight js %}
-$('#tree1').tree({
-    dataUrl: '/my/data/',
-    openFolderDelay: 1000
-});
-{% endhighlight %}

package/docs/_entries/options/rtl.md

@@ -1,18 +0,0 @@
----
-title: rtl
-name: options-rtl
----
-
-Set right-to-left support (true / false). Default is false.
-
-{% highlight js %}
-$('#tree1').tree({
-    rtl: true
-});
-{% endhighlight %}
-
-You can also set the option using ``data-rtl``.
-
-{% highlight html %}
-    <div id="tree1" data-url="/data" data-rtl></div>
-{% endhighlight %}

package/docs/_entries/options/savestate.md

@@ -1,39 +0,0 @@
----
-title: saveState
-name: options-savestate
----
-
-Save and restore the state of the tree automatically. The state is saved in localstorage.
-
-For this to work, you should give each node in the tree data an id field:
-
-{% highlight js %}
-{
-    name: 'node1',
-    id: 123,
-    childen: [
-        name: 'child1',
-        id: 124
-    ]
-}
-{% endhighlight %}
-
-* **true**: save and restore state in localstorage
-* **false (default)**: do nothing
-* **string**: save state and use this name to store
-
-{% highlight js %}
-$('#tree1').tree({
-    data: data,
-    saveState: true
-});
-{% endhighlight %}
-
-Example: save state in key 'tree1':
-
-{% highlight js %}
-$('#tree1').tree({
-    data: data,
-    saveState: 'tree1'
-});
-{% endhighlight %}