ExpandAll not working. How can I programatically expand a tree node in Vue?

Thread ID:	Created:	Updated:	Platform:	Replies:
147177	Sep 3,2019 11:58 PM UTC	Sep 4,2019 05:37 PM UTC	Vue	1

Subscribe to this post

Tags: Treeview

Adam Moroff

Asked On September 3, 2019 11:58 PM UTC

Hello

Im trying to expand a specific node in the treeview. This is the code Im using but I cant seem to expand the node prgramatically. Does anybody have an example of how to do this with Vue? Thanks.

Template

-----

 <ejs-treeview

                    id="treeview"

                    ref="treeview"

                    :fields="fields"

                    @nodeClicked="nodeClicked"

                  ></ejs-treeview>

Script

-----

 console.log('get tree data')
          let node = this.$refs.treeview.getNode('sec_1')
          console.log(node)
          console.log('expanding node ' + node.id)         
          this.$refs.treeview.expandAll([node.id])

Console

-----

get tree data

{id: "sec_1", text: "section1", parentID: null, selected: false, expanded: false, …}expanded: falsehasChildren: trueid: "sec_1"isChecked: nullparentID: nullselected: falsetext: "section1" notexpanding node sec_1

Reply | Reply with quote

Vinoth Kumar Sundara Moorthy [Syncfusion]

Replied On September 4, 2019 05:37 PM UTC

Hi Adam,

Thank you for contacting Syncfusion support.

We have validated your query. You can programmatically expand a node via any of the following methods

1. Using expandAll method

2. Using expandedNodes property

3. By mapping expanded: true while field declaration

We have prepared a sample to expand nodes programmatically in the nodeClicked event of the TreeView.

Code Example

nodeClicked: function(args) {

var node = this.$refs.tree1.getNode(args.node);

console.log(node);

//expand the nodes

this.$refs.tree1.expandAll([node.id]);

console.log("expanding node " + node.id);

// uncomment this to expand the selected node alone

// this.$refs.tree1.expandedNodes = [node.id]

}

Sample Link: https://codesandbox.io/s/vue-template-ttjsu

Could you please check the above sample and get back to us if you need any further assistance?

Regards,

Vinoth Kumar S

Reply | Reply with quote

CONTACT US

ExpandAll not working. How can I programatically expand a tree node in Vue?

Thread ID:

Created:

Updated:

Platform:

Replies:

Please sign in to access our forum

CONTACT US