jqtree 1.6.2 → 1.6.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.eslintrc +3 -12
- package/.github/workflows/ci.yml +48 -23
- package/.github/workflows/codeql-analysis.yml +9 -5
- package/.prettier +3 -0
- package/README.md +11 -8
- package/bower.json +1 -1
- package/{.postcssrc → config/.postcssrc} +0 -0
- package/{babel.config.json → config/babel.config.json} +0 -0
- package/{babel.coverage.config.json → config/babel.coverage.config.json} +0 -0
- package/{jest-jsdom.config.js → config/jest.config.js} +8 -3
- package/config/playwright.config.js +18 -0
- package/config/production +4 -0
- package/{rollup.config.js → config/rollup.config.js} +3 -3
- package/{jqtree.postcss → css/jqtree.postcss} +0 -0
- package/devserver/index.html +1 -9
- package/docs/Gemfile +2 -0
- package/docs/Gemfile.lock +263 -0
- package/{_config.yml → docs/_config.yml} +8 -1
- package/{_entries → docs/_entries}/01_general.md +0 -0
- package/{_entries → docs/_entries}/02_introduction.md +0 -0
- package/{_entries → docs/_entries}/03_features.md +1 -1
- package/{_entries → docs/_entries}/04_demo.html +1 -7
- package/{_entries → docs/_entries}/05_requirements.md +0 -0
- package/{_entries → docs/_entries}/06_downloads.md +0 -0
- package/{_entries → docs/_entries}/07_tutorial.md +0 -0
- package/{_entries → docs/_entries}/08_examples.md +0 -0
- package/{_entries → docs/_entries}/09_usecases.md +0 -0
- package/{_entries → docs/_entries}/10_changelog.md +4 -0
- package/{_entries → docs/_entries}/11_options.md +0 -0
- package/{_entries → docs/_entries}/12_animationspeed.md +0 -0
- package/{_entries → docs/_entries}/13_autoescape.md +0 -0
- package/{_entries → docs/_entries}/14_autoopen.md +0 -0
- package/{_entries → docs/_entries}/15_buttonleft.md +0 -0
- package/{_entries → docs/_entries}/16_closedicon.md +0 -0
- package/{_entries → docs/_entries}/17_data.md +0 -0
- package/{_entries → docs/_entries}/18_datafilter.md +0 -0
- package/{_entries → docs/_entries}/19_data-url.md +0 -0
- package/{_entries → docs/_entries}/20_draganddrop.md +0 -0
- package/{_entries → docs/_entries}/21_keyboardsupport.md +0 -0
- package/{_entries → docs/_entries}/22_oncanmove.md +0 -0
- package/{_entries → docs/_entries}/23_oncanmoveto.md +2 -2
- package/{_entries → docs/_entries}/24_oncanselectnode.md +0 -0
- package/{_entries → docs/_entries}/25_oncreateli.md +2 -2
- package/{_entries → docs/_entries}/26_ondragmove.md +0 -0
- package/{_entries → docs/_entries}/27_ondragstop.md +0 -0
- package/{_entries → docs/_entries}/28_onismovehandle.md +0 -0
- package/{_entries → docs/_entries}/29_onloadfailed.md +0 -0
- package/{_entries → docs/_entries}/30_onloading.md +2 -2
- package/{_entries → docs/_entries}/31_openedicon.md +0 -0
- package/{_entries → docs/_entries}/32_openfolderdelay.md +2 -0
- package/{_entries → docs/_entries}/33_rtl.md +0 -0
- package/{_entries → docs/_entries}/34_savestate.md +0 -0
- package/{_entries → docs/_entries}/35_selectable.md +0 -0
- package/{_entries → docs/_entries}/36_showemptyfolder.md +0 -0
- package/{_entries → docs/_entries}/37_slide.md +0 -0
- package/{_entries → docs/_entries}/38_start_dnd_delay.md +0 -0
- package/{_entries → docs/_entries}/39_tabindex.md +0 -0
- package/{_entries → docs/_entries}/40_usecontextmenu.md +0 -0
- package/{_entries → docs/_entries}/41_functions.md +0 -0
- package/{_entries → docs/_entries}/42_addparentnode.md +1 -1
- package/{_entries → docs/_entries}/43_addnodeafter.md +1 -1
- package/{_entries → docs/_entries}/44_addnodebefore.md +1 -1
- package/{_entries → docs/_entries}/45_appendnode.md +5 -5
- package/{_entries → docs/_entries}/46_closenode.md +0 -0
- package/{_entries → docs/_entries}/47_destroy.md +0 -0
- package/{_entries → docs/_entries}/48_getnodebycallback.md +0 -0
- package/{_entries → docs/_entries}/49_getnodebyid.md +0 -0
- package/{_entries → docs/_entries}/50_getnodebyhtmlelement.md +2 -2
- package/{_entries → docs/_entries}/51_getselectednode.md +0 -0
- package/{_entries → docs/_entries}/52_getstate.md +0 -0
- package/{_entries → docs/_entries}/53_gettree.md +1 -1
- package/{_entries → docs/_entries}/54_isdragging.md +1 -1
- package/{_entries → docs/_entries}/55_loaddata.md +3 -3
- package/{_entries → docs/_entries}/56_loaddatafromurl.md +4 -4
- package/{_entries → docs/_entries}/57_movedown.md +0 -0
- package/{_entries → docs/_entries}/58_movenode.md +3 -3
- package/{_entries → docs/_entries}/59_moveup.md +0 -0
- package/{_entries → docs/_entries}/60_opennode.md +3 -3
- package/docs/_entries/61_prependnode.md +21 -0
- package/{_entries → docs/_entries}/62_refresh.md +0 -0
- package/{_entries → docs/_entries}/63_reload.md +2 -2
- package/{_entries → docs/_entries}/64_removenode.md +0 -0
- package/{_entries → docs/_entries}/65_selectnode.md +0 -0
- package/{_entries → docs/_entries}/66_scrolltonode.md +0 -0
- package/{_entries → docs/_entries}/67_setoption.md +0 -0
- package/{_entries → docs/_entries}/68_setstate.md +0 -0
- package/{_entries → docs/_entries}/69_toggle.md +0 -0
- package/{_entries → docs/_entries}/70_tojson.md +0 -0
- package/{_entries → docs/_entries}/71_updatenode.md +1 -1
- package/{_entries → docs/_entries}/72_events.md +0 -0
- package/{_entries → docs/_entries}/73_tree-click.md +0 -0
- package/{_entries → docs/_entries}/74_tree-close.md +0 -0
- package/{_entries → docs/_entries}/75_tree-contextmenu.md +0 -0
- package/{_entries → docs/_entries}/76_tree-dblclick.md +0 -0
- package/{_entries → docs/_entries}/77_tree-init.md +0 -0
- package/{_entries → docs/_entries}/78_tree-load-data.md +0 -0
- package/{_entries → docs/_entries}/79_tree-loading-data.md +0 -0
- package/{_entries → docs/_entries}/80_tree-move.md +0 -0
- package/{_entries → docs/_entries}/81_tree-refresh.md +0 -0
- package/{_entries → docs/_entries}/82_tree-open.md +0 -0
- package/{_entries → docs/_entries}/83_tree-select.md +0 -0
- package/{_entries → docs/_entries}/84_multiple-selection.md +0 -0
- package/{_entries → docs/_entries}/85_add-to-selection.md +0 -0
- package/{_entries → docs/_entries}/86_get-selected-nodes.md +0 -0
- package/{_entries → docs/_entries}/87_is-node-selected.md +1 -1
- package/{_entries → docs/_entries}/88_remove-from-selection.md +0 -0
- package/{_entries → docs/_entries}/89_node-functions.md +0 -0
- package/{_entries → docs/_entries}/90_children.md +0 -0
- package/{_entries → docs/_entries}/91_getdata.md +2 -2
- package/{_entries → docs/_entries}/92_getlevel.md +0 -0
- package/{_entries → docs/_entries}/93_getnextnode.md +0 -0
- package/{_entries → docs/_entries}/94_getnextsibling.md +0 -0
- package/{_entries → docs/_entries}/95_getpreviousnode.md +0 -0
- package/{_entries → docs/_entries}/96_getprevioussibling.md +0 -0
- package/{_entries → docs/_entries}/97_parent.md +1 -1
- package/{_entries → docs/_entries}/insert.py +0 -0
- package/{_entries → docs/_entries}/renumber.py +0 -0
- package/{_examples → docs/_examples}/01_load_json_data.html +3 -5
- package/{_examples → docs/_examples}/02_load_json_data_from_server.html +3 -5
- package/{_examples → docs/_examples}/03_drag_and_drop.html +3 -5
- package/{_examples → docs/_examples}/04_save_state.html +3 -5
- package/{_examples → docs/_examples}/05_load_on_demand.html +3 -5
- package/{_examples → docs/_examples}/06_autoescape.html +3 -5
- package/{_examples → docs/_examples}/07_autoscroll.html +3 -5
- package/{_examples → docs/_examples}/08_multiple_select.html +3 -5
- package/{_examples → docs/_examples}/09_custom_html.html +3 -5
- package/{_examples → docs/_examples}/10_icon_buttons.html +3 -5
- package/{_examples → docs/_examples}/11_right-to-left.html +3 -5
- package/{_examples → docs/_examples}/12_button_on_right.html +3 -5
- package/docs/_examples/13_drag_outside.html +48 -0
- package/{_examples → docs/_examples}/14_filter.html +7 -9
- package/docs/_layouts/example.html +7 -0
- package/{_layouts/base.html → docs/_layouts/page.html} +4 -11
- package/docs/documentation.css +3 -0
- package/docs/index.html +65 -0
- package/docs/jqtree.css +189 -0
- package/docs/package.json +22 -0
- package/docs/pnpm-lock.yaml +768 -0
- package/docs/postcss.config.js +7 -0
- package/{static → docs/static}/bower.json +0 -1
- package/{static → docs/static}/bower_components/fontawesome/css/all.min.css +0 -0
- package/{static → docs/static}/bower_components/fontawesome/webfonts/fa-brands-400.eot +0 -0
- package/{static → docs/static}/bower_components/fontawesome/webfonts/fa-brands-400.svg +0 -0
- package/{static → docs/static}/bower_components/fontawesome/webfonts/fa-brands-400.ttf +0 -0
- package/{static → docs/static}/bower_components/fontawesome/webfonts/fa-brands-400.woff +0 -0
- package/{static → docs/static}/bower_components/fontawesome/webfonts/fa-brands-400.woff2 +0 -0
- package/{static → docs/static}/bower_components/fontawesome/webfonts/fa-regular-400.eot +0 -0
- package/{static → docs/static}/bower_components/fontawesome/webfonts/fa-regular-400.svg +0 -0
- package/{static → docs/static}/bower_components/fontawesome/webfonts/fa-regular-400.ttf +0 -0
- package/{static → docs/static}/bower_components/fontawesome/webfonts/fa-regular-400.woff +0 -0
- package/{static → docs/static}/bower_components/fontawesome/webfonts/fa-regular-400.woff2 +0 -0
- package/{static → docs/static}/bower_components/fontawesome/webfonts/fa-solid-900.eot +0 -0
- package/{static → docs/static}/bower_components/fontawesome/webfonts/fa-solid-900.svg +0 -0
- package/{static → docs/static}/bower_components/fontawesome/webfonts/fa-solid-900.ttf +0 -0
- package/{static → docs/static}/bower_components/fontawesome/webfonts/fa-solid-900.woff +0 -0
- package/{static → docs/static}/bower_components/fontawesome/webfonts/fa-solid-900.woff2 +0 -0
- package/{static → docs/static}/bower_components/jquery/dist/jquery.js +0 -0
- package/{static → docs/static}/bower_components/jquery/dist/jquery.min.js +0 -0
- package/{static → docs/static}/bower_components/jquery-mockjax/dist/jquery.mockjax.js +0 -0
- package/docs/static/documentation.css +1313 -0
- package/docs/static/documentation.js +26 -0
- package/{static → docs/static}/example.css +5 -37
- package/{static → docs/static}/example.postcss +5 -35
- package/{static → docs/static}/example_data.js +0 -0
- package/{static → docs/static}/examples/autoescape.js +0 -0
- package/{static → docs/static}/examples/autoscroll.js +0 -0
- package/{static → docs/static}/examples/button-on-right.js +0 -0
- package/{static → docs/static}/examples/custom_html.js +5 -9
- package/{static → docs/static}/examples/drag-outside.js +0 -0
- package/{static → docs/static}/examples/drag_and_drop.js +0 -0
- package/{static → docs/static}/examples/filter.js +2 -2
- package/{static → docs/static}/examples/icon_buttons.js +0 -0
- package/{static → docs/static}/examples/load_json_data.js +0 -0
- package/{static → docs/static}/examples/load_json_data_from_server.js +0 -0
- package/{static → docs/static}/examples/load_on_demand.js +0 -0
- package/{static → docs/static}/examples/multiple_select.js +0 -0
- package/{static → docs/static}/examples/right-to-left.js +0 -0
- package/{static → docs/static}/examples/save_state.js +0 -0
- package/{static → docs/static}/monokai.css +0 -0
- package/{static → docs/static}/spinner.gif +0 -0
- package/docs/tailwind.config.js +16 -0
- package/docs/tree.jquery.js +21 -0
- package/lib/dragAndDropHandler.js +8 -4
- package/lib/mouse.widget.js +3 -3
- package/lib/nodeElement.js +3 -3
- package/lib/playwright/coverage.js +140 -0
- package/lib/playwright/playwright.test.js +293 -201
- package/lib/playwright/testUtils.js +267 -0
- package/lib/test/jqTree/events.test.js +10 -9
- package/lib/test/jqTree/loadOnDemand.test.js +26 -21
- package/lib/test/jqTree/methods.test.js +84 -64
- package/lib/test/jqTree/options.test.js +41 -29
- package/lib/tree.jquery.js +4 -4
- package/package.json +48 -49
- package/src/dragAndDropHandler.ts +8 -4
- package/src/jqtreeOptions.ts +1 -1
- package/src/playwright/.eslintrc +2 -2
- package/src/playwright/coverage.ts +41 -0
- package/src/playwright/playwright.test.ts +50 -52
- package/src/playwright/playwright.test.ts-snapshots/with-dragAndDrop-moves-a-node-1-Chromium-darwin.png +0 -0
- package/src/playwright/playwright.test.ts-snapshots/with-dragAndDrop-moves-a-node-1-Chromium-linux.png +0 -0
- package/src/playwright/playwright.test.ts-snapshots/without-dragAndDrop-displays-a-tree-1-Chromium-darwin.png +0 -0
- package/src/playwright/playwright.test.ts-snapshots/without-dragAndDrop-displays-a-tree-1-Chromium-linux.png +0 -0
- package/src/playwright/playwright.test.ts-snapshots/without-dragAndDrop-selects-a-node-1-Chromium-darwin.png +0 -0
- package/src/playwright/playwright.test.ts-snapshots/without-dragAndDrop-selects-a-node-1-Chromium-linux.png +0 -0
- package/src/playwright/testUtils.ts +122 -0
- package/src/test/.eslintrc +13 -3
- package/src/test/jqTree/events.test.ts +10 -9
- package/src/test/jqTree/loadOnDemand.test.ts +10 -10
- package/src/test/jqTree/methods.test.ts +37 -45
- package/src/test/jqTree/options.test.ts +26 -28
- package/src/tree.jquery.d.ts +1 -1
- package/tree.jquery.debug.js +17 -14
- package/tree.jquery.debug.js.map +1 -1
- package/tree.jquery.js +3 -3
- package/tree.jquery.js.map +1 -1
- package/_entries/61_prependnode.md +0 -21
- package/_examples/13_drag_outside.html +0 -26
- package/_layouts/frontpage.html +0 -20
- package/_layouts/page.html +0 -7
- package/index.html +0 -48
- package/jest-browser.config.js +0 -15
- package/jest-playwright.config.js +0 -21
- package/jest.config.js +0 -8
- package/lib/playwright/testUtil.js +0 -459
- package/lib/playwright/visualRegression.js +0 -193
- package/production +0 -5
- package/src/playwright/screenshots/displays_a_tree_Desktop.png +0 -0
- package/src/playwright/screenshots/displays_a_tree_iPhone 6.png +0 -0
- package/src/playwright/screenshots/moves_a_node_Desktop.png +0 -0
- package/src/playwright/screenshots/moves_a_node_iPhone 6.png +0 -0
- package/src/playwright/screenshots/opens_a_node_Desktop.png +0 -0
- package/src/playwright/screenshots/opens_a_node_iPhone 6.png +0 -0
- package/src/playwright/screenshots/selects_a_node_Desktop.png +0 -0
- package/src/playwright/screenshots/selects_a_node_iPhone 6.png +0 -0
- package/src/playwright/testUtil.ts +0 -170
- package/src/playwright/visualRegression.ts +0 -88
- package/static/bower_components/bootstrap/dist/css/bootstrap-theme.min.css +0 -6
- package/static/bower_components/bootstrap/dist/css/bootstrap.min.css +0 -6
- package/static/bower_components/bootstrap/dist/fonts/glyphicons-halflings-regular.eot +0 -0
- package/static/bower_components/bootstrap/dist/fonts/glyphicons-halflings-regular.svg +0 -288
- package/static/bower_components/bootstrap/dist/fonts/glyphicons-halflings-regular.ttf +0 -0
- package/static/bower_components/bootstrap/dist/fonts/glyphicons-halflings-regular.woff +0 -0
- package/static/bower_components/bootstrap/dist/fonts/glyphicons-halflings-regular.woff2 +0 -0
- package/static/bower_components/bootstrap/dist/js/bootstrap.min.js +0 -6
- package/static/documentation.css +0 -171
- package/static/documentation.js +0 -48
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
@@ -9,8 +9,8 @@ You can override this function to determine if a node can be moved to a certain
|
|
|
9
9
|
$('#tree1').tree({
|
|
10
10
|
data: data,
|
|
11
11
|
dragAndDrop: true,
|
|
12
|
-
onCanMoveTo: function(
|
|
13
|
-
if (
|
|
12
|
+
onCanMoveTo: function(movedNode, targetNode, position) {
|
|
13
|
+
if (targetNode.isMenu) {
|
|
14
14
|
// Example: can move inside menu, not before or after
|
|
15
15
|
return (position == 'inside');
|
|
16
16
|
}
|
|
File without changes
|
|
@@ -9,12 +9,12 @@ The function is called with the following parameters:
|
|
|
9
9
|
|
|
10
10
|
* **node**: Node element
|
|
11
11
|
* **$li**: Jquery li element
|
|
12
|
-
* **
|
|
12
|
+
* **isSelected**: is the node selected (true/false)
|
|
13
13
|
|
|
14
14
|
{% highlight js %}
|
|
15
15
|
$('#tree1').tree({
|
|
16
16
|
data: data,
|
|
17
|
-
onCreateLi: function(node, $li,
|
|
17
|
+
onCreateLi: function(node, $li, isSelected) {
|
|
18
18
|
// Add 'icon' span before title
|
|
19
19
|
$li.find('.jqtree-title').before('<span class="icon"></span>');
|
|
20
20
|
}
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
@@ -8,10 +8,10 @@ The onLoading parameter is called when the tree data is loading. This gives us t
|
|
|
8
8
|
Callback looks like this:
|
|
9
9
|
|
|
10
10
|
```js
|
|
11
|
-
function (
|
|
11
|
+
function (isLoading, node, $el)
|
|
12
12
|
```
|
|
13
13
|
|
|
14
|
-
* **
|
|
14
|
+
* **isLoading**: boolean
|
|
15
15
|
* true: data is loading
|
|
16
16
|
* false: data is loaded
|
|
17
17
|
* **node**:
|
|
File without changes
|
|
@@ -5,6 +5,8 @@ name: options-openfolderdelay
|
|
|
5
5
|
|
|
6
6
|
Set the delay for opening a folder during drag-and-drop. The delay is in milliseconds. The default is 500 ms.
|
|
7
7
|
|
|
8
|
+
* Setting the option to `false` disables opening folders during drag-and-drop.
|
|
9
|
+
|
|
8
10
|
{% highlight js %}
|
|
9
11
|
$('#tree1').tree({
|
|
10
12
|
dataUrl: '/my/data/',
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
@@ -3,12 +3,12 @@ title: appendNode
|
|
|
3
3
|
name: functions-appendnode
|
|
4
4
|
---
|
|
5
5
|
|
|
6
|
-
**function appendNode(
|
|
6
|
+
**function appendNode(newNodeInfo, parentNode);**
|
|
7
7
|
|
|
8
|
-
Add a node to this parent node. If **
|
|
8
|
+
Add a node to this parent node. If **parentNode** is empty, then the new node becomes a root node.
|
|
9
9
|
|
|
10
10
|
{% highlight js %}
|
|
11
|
-
var
|
|
11
|
+
var parentNode = $tree.tree('getNodeById', 123);
|
|
12
12
|
|
|
13
13
|
$tree.tree(
|
|
14
14
|
'appendNode',
|
|
@@ -16,7 +16,7 @@ $tree.tree(
|
|
|
16
16
|
name: 'new_node',
|
|
17
17
|
id: 456
|
|
18
18
|
},
|
|
19
|
-
|
|
19
|
+
parentNode
|
|
20
20
|
);
|
|
21
21
|
{% endhighlight %}
|
|
22
22
|
|
|
@@ -45,6 +45,6 @@ $tree.tree(
|
|
|
45
45
|
{ name: 'child2', id: 458 }
|
|
46
46
|
]
|
|
47
47
|
},
|
|
48
|
-
|
|
48
|
+
parentNode
|
|
49
49
|
);
|
|
50
50
|
{% endhighlight %}
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
@@ -3,9 +3,9 @@ title: getNodeByHtmlElement
|
|
|
3
3
|
name: functions-getnodebyhtmlelement
|
|
4
4
|
---
|
|
5
5
|
|
|
6
|
-
**function getNodeByHtmlElement(
|
|
6
|
+
**function getNodeByHtmlElement(htmlElement);**
|
|
7
7
|
|
|
8
|
-
Get a tree node by an html element. The html
|
|
8
|
+
Get a tree node by an html element. The html htmlElement should be:
|
|
9
9
|
|
|
10
10
|
* The `li` element for the node
|
|
11
11
|
* Or, an element inside the `li`. For example the `span` for the title.
|
|
File without changes
|
|
File without changes
|
|
@@ -5,7 +5,7 @@ name: functions-loaddata
|
|
|
5
5
|
|
|
6
6
|
**function loadData(data);**
|
|
7
7
|
|
|
8
|
-
**function loadData(data,
|
|
8
|
+
**function loadData(data, parentNode);**
|
|
9
9
|
|
|
10
10
|
Load data in the tree. The data is array of nodes.
|
|
11
11
|
|
|
@@ -13,7 +13,7 @@ You can **replace the whole tree** or you can **load a subtree**.
|
|
|
13
13
|
|
|
14
14
|
{% highlight js %}
|
|
15
15
|
// Assuming the tree exists
|
|
16
|
-
var
|
|
16
|
+
var newData = [
|
|
17
17
|
{
|
|
18
18
|
name: 'node1',
|
|
19
19
|
children: [
|
|
@@ -28,7 +28,7 @@ var new_data = [
|
|
|
28
28
|
]
|
|
29
29
|
}
|
|
30
30
|
];
|
|
31
|
-
$('#tree1').tree('loadData',
|
|
31
|
+
$('#tree1').tree('loadData', newData);
|
|
32
32
|
{% endhighlight %}
|
|
33
33
|
|
|
34
34
|
Load a subtree:
|
|
@@ -5,9 +5,9 @@ name: functions-loaddatafromurl
|
|
|
5
5
|
|
|
6
6
|
**function loadDataFromUrl(url);**
|
|
7
7
|
|
|
8
|
-
**function loadDataFromUrl(url,
|
|
8
|
+
**function loadDataFromUrl(url, parentNode);**
|
|
9
9
|
|
|
10
|
-
**function loadDataFromUrl(
|
|
10
|
+
**function loadDataFromUrl(parentNode);**
|
|
11
11
|
|
|
12
12
|
Load data in the tree from an url using ajax. You can **replace the whole tree** or you can **load a subtree**.
|
|
13
13
|
|
|
@@ -39,9 +39,9 @@ $tree.tree('loadDataFromUrl', node);
|
|
|
39
39
|
|
|
40
40
|
You can also add an **on_finished** callback parameter that will be called when the data is loaded:
|
|
41
41
|
|
|
42
|
-
**function loadDataFromUrl(url,
|
|
42
|
+
**function loadDataFromUrl(url, parentNode, onFinished);**
|
|
43
43
|
|
|
44
|
-
**function loadDataFromUrl(
|
|
44
|
+
**function loadDataFromUrl(parentNode, onFinished);**
|
|
45
45
|
|
|
46
46
|
{% highlight js %}
|
|
47
47
|
$('#tree1').tree(
|
|
File without changes
|
|
@@ -3,13 +3,13 @@ title: moveNode
|
|
|
3
3
|
name: functions-movenode
|
|
4
4
|
---
|
|
5
5
|
|
|
6
|
-
**function moveNode(node,
|
|
6
|
+
**function moveNode(node, targetNode, position);**
|
|
7
7
|
|
|
8
8
|
Move a node. Position can be 'before', 'after' or 'inside'.
|
|
9
9
|
|
|
10
10
|
{% highlight js %}
|
|
11
11
|
var node = $tree.tree('getNodeById', 1);
|
|
12
|
-
var
|
|
12
|
+
var targetNode = $tree.tree('getNodeById', 2);
|
|
13
13
|
|
|
14
|
-
$tree.tree('moveNode', node,
|
|
14
|
+
$tree.tree('moveNode', node, targetNode, 'after');
|
|
15
15
|
{% endhighlight %}
|
|
File without changes
|
|
@@ -7,14 +7,14 @@ name: functions-opennode
|
|
|
7
7
|
|
|
8
8
|
**function openNode(node, slide);**
|
|
9
9
|
|
|
10
|
-
**function openNode(node,
|
|
10
|
+
**function openNode(node, onFinished);**
|
|
11
11
|
|
|
12
|
-
**function openNode(node, slide,
|
|
12
|
+
**function openNode(node, slide, onFinished);**
|
|
13
13
|
|
|
14
14
|
Open this node. The node must have child nodes.
|
|
15
15
|
|
|
16
16
|
Parameter **slide (optional)**: open the node using a slide animation (default is true).
|
|
17
|
-
Parameter **
|
|
17
|
+
Parameter **onFinished (optional)**: callback when the node is opened; this also works for nodes that are loaded lazily
|
|
18
18
|
|
|
19
19
|
{% highlight js %}
|
|
20
20
|
// create tree
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
---
|
|
2
|
+
title: prependNode
|
|
3
|
+
name: functions-prependnode
|
|
4
|
+
---
|
|
5
|
+
|
|
6
|
+
**function prependNode(newNodeInfo, parentNode);**
|
|
7
|
+
|
|
8
|
+
Add a node to this parent node as the first child. If **parentNode** is empty, then the new node becomes a root node.
|
|
9
|
+
|
|
10
|
+
{% highlight js %}
|
|
11
|
+
var parentNode = $tree.tree('getNodeById', 123);
|
|
12
|
+
|
|
13
|
+
$tree.tree(
|
|
14
|
+
'prependNode',
|
|
15
|
+
{
|
|
16
|
+
name: 'new_node',
|
|
17
|
+
id: 456
|
|
18
|
+
},
|
|
19
|
+
parentNode
|
|
20
|
+
);
|
|
21
|
+
{% endhighlight %}
|
|
File without changes
|
|
@@ -5,11 +5,11 @@ name: functions-reload
|
|
|
5
5
|
|
|
6
6
|
**function reload();**
|
|
7
7
|
|
|
8
|
-
**function reload(
|
|
8
|
+
**function reload(onFinished);**
|
|
9
9
|
|
|
10
10
|
Reload data from the server.
|
|
11
11
|
|
|
12
|
-
* Call `
|
|
12
|
+
* Call `onFinished` when the data is loaded.
|
|
13
13
|
|
|
14
14
|
{% highlight js %}
|
|
15
15
|
$('#tree1').tree('reload');
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
@@ -3,11 +3,11 @@ title: getData
|
|
|
3
3
|
name: node-functions-getdata
|
|
4
4
|
---
|
|
5
5
|
|
|
6
|
-
**function getData(
|
|
6
|
+
**function getData(includeParent = false);**
|
|
7
7
|
|
|
8
8
|
Get the subtree of this node.
|
|
9
9
|
|
|
10
|
-
**
|
|
10
|
+
**includeParent**
|
|
11
11
|
|
|
12
12
|
* **true**: include node and children
|
|
13
13
|
* **false**: only include children (default)
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
@@ -1,18 +1,16 @@
|
|
|
1
1
|
---
|
|
2
2
|
title: Load json data in javascript tree
|
|
3
|
-
layout: page
|
|
4
3
|
js: examples/load_json_data.js
|
|
5
|
-
css: example.css
|
|
6
4
|
---
|
|
7
5
|
|
|
8
|
-
<p
|
|
6
|
+
<p class="flex justify-between">
|
|
9
7
|
<a href="../../index.html">« Documentation</a>
|
|
10
|
-
<a href="../02_load_json_data_from_server/"
|
|
8
|
+
<a href="../02_load_json_data_from_server/">Example 2 »</a>
|
|
11
9
|
</p>
|
|
12
10
|
|
|
13
11
|
<h1>Example 1 - load json data</h1>
|
|
14
12
|
|
|
15
|
-
<div id="tree1"></div>
|
|
13
|
+
<div id="tree1" class="not-prose"></div>
|
|
16
14
|
|
|
17
15
|
<p>
|
|
18
16
|
In this example we load the data using the <strong>data</strong> option.
|
|
@@ -1,18 +1,16 @@
|
|
|
1
1
|
---
|
|
2
2
|
title: Load json data from the server in javascript tree
|
|
3
|
-
layout: page
|
|
4
3
|
js: examples/load_json_data_from_server.js
|
|
5
|
-
css: example.css
|
|
6
4
|
---
|
|
7
5
|
|
|
8
|
-
<p
|
|
6
|
+
<p class="flex justify-between">
|
|
9
7
|
<a href="../01_load_json_data/">« Example 1</a>
|
|
10
|
-
<a href="../03_drag_and_drop/"
|
|
8
|
+
<a href="../03_drag_and_drop/">Example 3 »</a>
|
|
11
9
|
</p>
|
|
12
10
|
|
|
13
11
|
<h1>Example 2 - load json data from the server</h1>
|
|
14
12
|
|
|
15
|
-
<div id="tree1" data-url="/example_data/"></div>
|
|
13
|
+
<div id="tree1" class="not-prose" data-url="/example_data/"></div>
|
|
16
14
|
|
|
17
15
|
<p>
|
|
18
16
|
In this example we load the data from the server using the <strong>data-url</strong> property on the dom element.
|
|
@@ -1,18 +1,16 @@
|
|
|
1
1
|
---
|
|
2
2
|
title: Javascript tree with drag and drop
|
|
3
|
-
layout: page
|
|
4
3
|
js: examples/drag_and_drop.js
|
|
5
|
-
css: example.css
|
|
6
4
|
---
|
|
7
5
|
|
|
8
|
-
<p
|
|
6
|
+
<p class="flex justify-between">
|
|
9
7
|
<a href="../02_load_json_data_from_server/">« Example 2</a>
|
|
10
|
-
<a href="../04_save_state/"
|
|
8
|
+
<a href="../04_save_state/">Example 4 »</a>
|
|
11
9
|
</p>
|
|
12
10
|
|
|
13
11
|
<h1>Example 3 - Drag and drop</h1>
|
|
14
12
|
|
|
15
|
-
<div id="tree1" data-url="/example_data/"></div>
|
|
13
|
+
<div id="tree1" class="not-prose" data-url="/example_data/"></div>
|
|
16
14
|
|
|
17
15
|
<p>
|
|
18
16
|
Let's add drag-and-drop support by setting the option <strong>dragAndDrop</strong> to true.
|
|
@@ -1,18 +1,16 @@
|
|
|
1
1
|
---
|
|
2
2
|
title: Save the state in javascript tree
|
|
3
|
-
layout: page
|
|
4
3
|
js: examples/save_state.js
|
|
5
|
-
css: example.css
|
|
6
4
|
---
|
|
7
5
|
|
|
8
|
-
<p
|
|
6
|
+
<p class="flex justify-between">
|
|
9
7
|
<a href="../03_drag_and_drop/">« Example 3</a>
|
|
10
|
-
<a href="../05_load_on_demand/"
|
|
8
|
+
<a href="../05_load_on_demand/">Example 5 »</a>
|
|
11
9
|
</p>
|
|
12
10
|
|
|
13
11
|
<h1>Example 4 - Save the state</h1>
|
|
14
12
|
|
|
15
|
-
<div id="tree1" data-url="/example_data/"></div>
|
|
13
|
+
<div id="tree1" class="not-prose" data-url="/example_data/"></div>
|
|
16
14
|
|
|
17
15
|
<p>
|
|
18
16
|
If you set the option <strong>saveState</strong> to true, then jqtree remembers the tree state after a page reload.
|
|
@@ -1,19 +1,17 @@
|
|
|
1
1
|
---
|
|
2
2
|
title: Load nodes on demand from the server in javascript tree
|
|
3
|
-
layout: page
|
|
4
3
|
js: examples/load_on_demand.js
|
|
5
|
-
css: example.css
|
|
6
4
|
---
|
|
7
5
|
|
|
8
|
-
<p
|
|
6
|
+
<p class="flex justify-between">
|
|
9
7
|
<a href="../04_save_state/">« Example 4</a>
|
|
10
|
-
<a href="../06_autoescape/"
|
|
8
|
+
<a href="../06_autoescape/">Example 6 »</a>
|
|
11
9
|
</p>
|
|
12
10
|
|
|
13
11
|
<h1>Example 5 - Load nodes on demand from the server</h1>
|
|
14
12
|
|
|
15
13
|
|
|
16
|
-
<div id="tree1" data-url="/nodes/"></div>
|
|
14
|
+
<div id="tree1" class="not-prose" data-url="/nodes/"></div>
|
|
17
15
|
|
|
18
16
|
<p>
|
|
19
17
|
In this example, the data is loaded on demand from the server.
|
|
@@ -1,13 +1,11 @@
|
|
|
1
1
|
---
|
|
2
2
|
title: Javascript tree with autoescape
|
|
3
|
-
layout: page
|
|
4
3
|
js: examples/autoescape.js
|
|
5
|
-
css: example.css
|
|
6
4
|
---
|
|
7
5
|
|
|
8
|
-
<p
|
|
6
|
+
<p class="flex justify-between">
|
|
9
7
|
<a href="../05_load_on_demand/">« Example 5</a>
|
|
10
|
-
<a href="../07_autoscroll/"
|
|
8
|
+
<a href="../07_autoscroll/">Example 7 »</a>
|
|
11
9
|
</p>
|
|
12
10
|
|
|
13
11
|
<h1>Example 6 - autoEscape</h1>
|
|
@@ -16,7 +14,7 @@ css: example.css
|
|
|
16
14
|
You can put html in the node titles setting the <a href="../index.html#tree-options-autoescape">autoEscape</a> option to <strong>false</strong>.
|
|
17
15
|
</p>
|
|
18
16
|
|
|
19
|
-
<div id="tree1"></div>
|
|
17
|
+
<div id="tree1" class="not-prose"></div>
|
|
20
18
|
|
|
21
19
|
<h3>html</h3>
|
|
22
20
|
|
|
@@ -1,18 +1,16 @@
|
|
|
1
1
|
---
|
|
2
2
|
title: Javascript tree with autoscroll
|
|
3
|
-
layout: page
|
|
4
3
|
js: examples/autoscroll.js
|
|
5
|
-
css: example.css
|
|
6
4
|
---
|
|
7
5
|
|
|
8
|
-
<p
|
|
6
|
+
<p class="flex justify-between">
|
|
9
7
|
<a href="../06_autoescape/">« Example 6</a>
|
|
10
|
-
<a href="../08_multiple_select/"
|
|
8
|
+
<a href="../08_multiple_select/">Example 8 »</a>
|
|
11
9
|
</p>
|
|
12
10
|
|
|
13
11
|
<h1>Example 7 - autoscroll</h1>
|
|
14
12
|
|
|
15
|
-
<div id="scroll-container"><div id="tree1"></div></div>
|
|
13
|
+
<div id="scroll-container"><div id="tree1" class="not-prose"></div></div>
|
|
16
14
|
|
|
17
15
|
<p>
|
|
18
16
|
This is an example of autoscroll. The tree will scroll automatically if you
|