Changes for page Tree Widget
Last modified by Admin on 2024/03/29 01:15
Change comment:
There is no comment for this version
Summary
-
Page properties (1 modified, 0 added, 0 removed)
-
Objects (1 modified, 0 added, 0 removed)
Details
- Page properties
-
- Author
-
... ... @@ -1,1 +1,1 @@ 1 -xwiki:XWiki. Admin1 +xwiki:XWiki.mflorea
- ExtensionCode.ExtensionClass[0]
-
- Description
-
... ... @@ -489,3 +489,67 @@ 489 489 * [[Document Tree Macro>>Extension.Document Tree Macro]] 490 490 * Navigation Panel 491 491 * [[The WYSIWYG Editor>>platform:Features.WysiwygEditor]] 492 + 493 +== Static Tree == 494 + 495 +Create a new page ##Test.StaticTree## with the following content: 496 + 497 +{{code language="none"}} 498 +{{velocity}} 499 +{{html}} 500 +#set ($discard = $xwiki.linkx.use($services.webjars.url('org.xwiki.platform:xwiki-platform-tree-webjar', 'tree.min.css', 501 + {'evaluate': true}), {'type': 'text/css', 'rel': 'stylesheet'})) 502 +#set ($discard = $xwiki.jsx.use('Test.StaticTree')) 503 +<div class="myCustomTree"> 504 + <ul> 505 + <li><a>Group 1</a> 506 + <ul> 507 + <li><a>SubGroup 1</a></li> 508 + <ul> 509 + <li><a>Item 11</a></li> 510 + <li><a>Item 12</a></li> 511 + <li><a>Item 13</a></li> 512 + </ul> 513 + <li><a>SubGroup 2</a></li> 514 + <li><a>Item 21</a></li> 515 + <li><a>Item 22</a></li> 516 + </ul> 517 + </li> 518 + <li> 519 + <a>SubGroup 3</a> 520 + <ul> 521 + <li><a>Item 31</a></li> 522 + <li><a>Item 32</a></li> 523 + </ul> 524 + </li> 525 + <li> 526 + <a>Item 4</a> 527 + </li> 528 + </ul> 529 +</div> 530 +{{/html}} 531 +{{/velocity}} 532 +{{/code}} 533 + 534 +Then add a ##JavaScriptObject## with this content to the same page: 535 + 536 +{{code language="js"}} 537 +require(["$!services.webjars.url('org.xwiki.platform:xwiki-platform-tree-webjar', 'require-config.min.js', {'evaluate': true})"], function() { 538 + require(['tree'], function($) { 539 + $('.myCustomTree').xtree({ 540 + core: { 541 + themes: { 542 + icons: false, 543 + dots: false 544 + } 545 + }, 546 + plugins: ['checkbox'], 547 + checkbox: { 548 + three_state: false 549 + } 550 + }); 551 + }); 552 +}); 553 +{{/code}} 554 + 555 +Make sure you set the "Parse content" property to Yes, then save and view the page. Check the [[jsTree documentation>>https://www.jstree.com/]] for more configuration options. - Show installed count
-
... ... @@ -1,0 +1,1 @@ 1 +Yes