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. Image for the cookie policy date

Expand/collapse nodes


In this sample http://asp.syncfusion.com/demos/web/treegrid/columntemplate.aspx, how to show the icons to expand/collapse the nodes?


1 Reply

MK Mahalakshmi Karthikeyan Syncfusion Team February 24, 2016 01:28 PM UTC

Hi Jorge,

We can render the Expand/ Collapse icons as like in the normal TreeGrid samples by removing all the styles in the sample and include “e-icon” this class with the e-treegridexpand and e-treegridcollapse. Please refer the below code example for details.

<script type="text/x-jsrender" id="customColumnTemplate">     

      <div class='{{if expanded}}e-treegridexpand e-icon  {{else hasChildRecords}}e-  

           treegridcollapse e-icon {{/if}}' style='height:20px;width:30px;margin:auto;float:left;margin-left:10px;'




We have also prepared a sample based on this and you can find the sample under the following location.

Sample: http://www.syncfusion.com/downloads/support/directtrac/general/ze/ColumnTemplate132455021


Mahalakshmi K.

Live Chat Icon For mobile
Up arrow icon