Print Page - [SOLVED] Find Tree Node by Name

Title: [SOLVED] Find Tree Node by Name
Post by: don on July 10, 2018, 09:56:08 AM

I'm using a simple list (ul) for the nodes of my tree. Can someone tell me how to search or find a specific node using only the list item's text? Ultimately I want to check/uncheck a checkbox node using code. So for example, if I had a checkbox tree that listed colors, I could (using code) check nodes 'red' and 'yellow'. ???

Title: Re: Find Tree Node by Name
Post by: stworthy on July 11, 2018, 01:28:33 AM

The code below shows how to find a node by 'text' and check it.

Code:

var t = $('#tt');
var mynode = null;
var roots = t.tree('getRoots');
$.easyui.forEach(roots, true, function(node){
    if (node.text == 'Java'){
        mynode = node;
        return false;
    }
});
if (mynode){
    var el = $('#'+mynode.domId);
    t.tree('check', el[0])
}

Title: Re: Find Tree Node by Name
Post by: don on July 11, 2018, 07:01:16 AM

[SOLVED] Thanks stworthy! For others and future reference, here is a function that returns a tree node's element using the node's text:

Code:

/**
*Retrieve tree node element using node list item <li> text
 *
 * @param {easyUI.Tree} tree easyUI tree object
 * @param {string} nodeText list item <li> text of desired node
 * 
 * @return {element} the tree node <li> element
 */
function getNodeByText(tree, nodeText) {
	var mynode = null;
	var roots = tree.tree('getRoots');
	$.easyui.forEach(roots, true, function (node) {
		if (node.text == nodeText) {
			mynode = node;
			return false;
		}
	});
	return $('#' + mynode.domId);
};

Title: Re: [SOLVED] Find Tree Node by Name
Post by: officecode on October 17, 2018, 08:30:24 PM

This feature is great.
Can the official consider adding a findNode method to the tree component? Just like the findItem method in menu, let everyone find the tree node based on the text content.
Because the getNode and getData methods in the tree are too inconvenient to use!
For reference only, thank you!

Title: Re: [SOLVED] Find Tree Node by Name
Post by: stworthy on October 18, 2018, 06:07:48 PM

The 'find' method will be enhanced in next version.
Code examples:

Code:

var node1 = $('#tt').tree('find', 122);  // find by id
var node2 = $('#tt').tree('find', {text:'Java'});  // find by text
var node3 = $('#tt').tree('find', function(node){
  if (node.id > 100){
    return true;
  }
});  // find by custom function

EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: don on July 10, 2018, 09:56:08 AM