We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: June 24, 2019).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

parent data Text name is not showing

Thread ID:

Created:

Updated:

Platform:

Replies:

149830 Dec 11,2019 09:11 AM UTC Dec 12,2019 11:23 AM UTC React - EJ 2 1
loading
Tags: Treeview
Saravanan
Asked On December 11, 2019 09:11 AM UTC

i am using function component class. in  useEffect i am getting  JSON data  from Api After that i am defining one state and storing value in that state.when i am bindind that state data into the tree view component parent data text name is not showing. But After collapse icon child data is showing.
(note-i need to use useEffect and state).
Thanks,
Saravana

Attachment: treeview_3f9652ae.zip

Keerthana Rajendran [Syncfusion]
Replied On December 12, 2019 11:23 AM UTC

Hi Saravanan, 
  
Greetings from Syncfusion support, 
 
We have checked your reported issue “parent item text not rendered” at our end. The reported problem occurs due to the data retrieved with some delay and each time the dataSource property is accessed on rendering of every parent item . You can resolve this issue by using delayUpdate and store the fields values and use it in TreeView component.  
 
Please refer the following code block. 
  
<TreeViewComponent delayUpdate="true" nodeTemplate={nodeTemplate} id="target" fields={treeViewFields} nodeSelected={nodeSelected}/> 
  
const [treeViewFields, settreeViewData] = useState(); 
useEffect(() => { 
var data=[ 
{ 
id: "39f156f5bebc978695cceafd73998663", 
type: "Application", 
spriteCssClass: "folder", 
expanded: true, 
text: "ApplicationNew", 
contextMenu: true, 
isMain: true, 
child: [ 
{ 
id: "39f157dd2293741dd9d3d34122f22ab1", 
type: "Module", 
text: "Account", 
expanded: false, 
spriteCssClass: "folder", 
contextMenu: true, 
isMain: false, 
allowAPI: false, 
isCodeGenerated: false, 
}, 
{ 
id: "39f156f63683cbe9bd3d27011400cfa1", 
type: "Module", 
text: "Organization", 
expanded: false, 
spriteCssClass: "folder", 
contextMenu: true, 
isMain: false, 
allowAPI: false, 
isCodeGenerated: false, 
  
}] 
}] 
 
var fields = { 
dataSource: data, 
id: "id", 
text: "text", 
hasChildren: "hasChild" 
} 
settreeViewData(fields); 
}, []); 
  
  
Sample: 
  
  
Please check the above sample and get back to us, if you require any further assistance on this. 
  
Regards, 
Keerthana. 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon