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

TreeGrid - can I move the collapse/expand button (downward triangle) to the left side?

Thread ID:

Created:

Updated:

Platform:

Replies:

144462 May 7,2019 06:31 PM UTC May 17,2019 10:18 AM UTC Angular - EJ 2 5
loading
Tags: TreeGrid
Deanna Delapasse
Asked On May 7, 2019 06:31 PM UTC

See screenshot - the collapse/expand button is awkwardly placed since my strings are varying widths.  Any way to move it to the left side?

Attachment: treegrid_70da8773.zip

Vignesh Natarajan [Syncfusion]
Replied On May 8, 2019 01:00 PM UTC

Hi Deanna, 

Thanks for contacting Syncfusion Forums. 

Query: “TreeGrid - can I move the collapse/expand button (downward triangle) to the left side?” 
 
In TreeGrid, expand/collapse icons are indented based on the level of the record (either parent or child) and not based on the width of the previous column content.  

Please refer the below sample for better understanding, 


But we have achieved your requirement (to render the icons without any indent both for parent and child records) by making changes in CSS. Kindly refer the below sample for your reference 


Please get back to us if you have further queries. 

Regards, 
Vignesh Natarajan. 


Deanna Delapasse
Replied On May 8, 2019 01:22 PM UTC

Hi Vignesh!

Thanks for the example!  I would really prefer the dropdowns to be on the left side of my first column so it appears more like a tree.  Any way to accomplish that?

Deanna


Vignesh Natarajan [Syncfusion]
Replied On May 9, 2019 06:12 AM UTC

Hi Deanna, 

Thanks for the update. 

Query: I would really prefer the dropdowns to be on the left side of my first column so it appears more like a tree.  Any way to accomplish that? 

Based on the above query, we suspect that you want show the expand / collapse icon for the first column of treegrid. To achieve this, we suggest you to set the treeColumnIndex as 0. Please refer the below link for sample, 


Output 

 


Refer our API documentation for your reference 


If we misunderstood your query, please get back to us with more details on your requirement. We will be happy to assist you. 

Regards, 
Vignesh Natarajan. 
 


Sabitha Rajamani [Syncfusion]
Replied On May 16, 2019 12:10 PM UTC

From: Delapasse, Deanna
Sent: Thursday, May 16, 2019 7:52 AM
To: Syncfusion Support <support@syncfusion.com>
Subject: Re: Syncfusion support community forum 144462, TreeGrid - can I move the collapse/expand button (downward triangle) to the left side?, has been updated. 

This is perfect, but I deleted the css and the leftalign and am still seeing the arrows on the left.  What setting did you use to accomplish that? 


Vignesh Natarajan [Syncfusion]
Replied On May 17, 2019 10:18 AM UTC

Hi Deanna,  
  
Thanks for the update.   
  
QUERY: deleted the css and the leftalign and still seeing the arrows on the left  
   
From your query, we understand that you have removed the “textAlign” and css applied to TreeGrid. But still you can able to render TreeGrid without any indent of expand/collapse icon.   
  
But we are not able to reproduce the same behavior at our end. Once the css and textalign is removed, indent is applied to child record. Refer the below sample and screenshot for your reference  
  
  
  
   
We suspect that, you could have faced some cache issue and we suggest you to refresh the page once you remove the textAlign and CSS by clearing the cache. Even after refreshing the page, still the indent is not applied kindly share your code example and version details, so that we can be able to analyze the issue.  
   
  
Regards,  
Vignesh Natarajan.  
  


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