JavaScript UI Libraries & Blazor Components Suite – Smart UI Forums Menu & Tree How to Smart.Tree get selection by value

Tagged: 

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #101952
    fxgallego
    Member

    Hi,
    The tree component allows to set the valueMember for the dataSource: https://www.htmlelements.com/react/demos/tree/overview/#toc-valuemember_string
    The problem is I don’t know how to get the selections by this valueMember instead on the values in the property selectedIndexes. Should I track the values using onChange?
    There is no way to manage expanded and checked items in a Controlled way?
    Thanks in advance

    #101957
    yavordashew
    Member

    Hi Sebastian Calvo,
    I have created a code example which showcases how to get the selectedIndexes when you have set the valueMember of the SmartTree.

           selectedItems =  [];
    	getItems (){
    		let selected= this.tree.current.selectedIndexes;
    		this.selectedItems = [];
    		for (let i =0; i < selected.length; i++) {
    			this.selectedItems.push(this.tree.current.getItem(selected[i]));
    		}
    		Promise.all(this.selectedItems).then((values) => {
    			this.selectedItems = values;
    		});
    	}
    	expandItem () {
    		if (!this.selectedItems[0].expanded){
    			this.tree.current.expandItem(this.selectedItems[0], true)
    		}
    	}
    	render() {
    		return (
    			<div>
    				<Tree id="tree1" ref={this.tree} scrollMode="scrollbar" className="animation" selectionMode="oneOrMany"
    					showLines dataSource={this.treeDataSource} displayMember="label" valueMember="value"></Tree>
            <button onClick={this.getItems.bind(this)}> Get selected items</button>
    		<button onClick={this.expandItem.bind(this)}> Expand item</button>
          </div>
    		);
    	}
    }

    In this code snippet also showcases a simple way to manage expanded and checked items.
    Let me know if that works for you!
    Please, do not hesitate to contact us if you have any additional questions.
    Best regards,
    Yavor Dashev
    Smart UI Team
    https://www.htmlelements.com/

    #101962
    fxgallego
    Member

    Thanks! I’ll check the examples and let you know how they worked!
     

Viewing 3 posts - 1 through 3 (of 3 total)
  • You must be logged in to reply to this topic.