Print Page - [SOLVED]All menus to tree

Title: [SOLVED]All menus to tree
Post by: jega on October 31, 2018, 11:55:05 AM

Hi.

As a test i have this

<a id="menu1" href="#" class="easyui-menubutton" data-options="menu:'#menu_1'">Menu 1</a>
<a id="menu2" href="#" class="easyui-menubutton" data-options="menu:'#menu_2'">Menu 2</a>

<ul id="tt" class="easyui-tree"></ul>

<div id="menu_1"></div>
<div id="menu_2"></div>

Menu items created from db

Have added the extended code found in another topic with getItems

Then i test with this code

      $('#tt').tree({
         checkbox:true,
         onlyLeafCheck:true,
         data:$('#menu_1').menu('getItems')
      });

Now i have a nice tree with nodes from menu_1.

I would like to have a tree with both menu_1 and menu_2. Any help ??

The best solution is that some code takes all menubutton on site, and make a tree of the whole menu structure.

Regards
jesper

Title: Re: All menus to tree
Post by: jarry on November 01, 2018, 02:04:27 AM

The code below retrieves all the menubutton components on the page and build a tree based on the bound menus.

Code:

var nodes = [];
$('.m-btn').each(function(){
	var opts = $(this).menubutton('options');
	nodes.push({
		text: opts.text,
		children: $(opts.menu).menu('getItems')
	})
});
$('#tt').tree({
	checkbox:true,
	onlyLeafCheck:true,
	data:nodes
});

Title: Re: All menus to tree
Post by: jega on November 01, 2018, 04:34:10 AM

Thanks Jerry.

I knew there was an easy way to do it :D

Jesper

EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: jega on October 31, 2018, 11:55:05 AM