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

nodeUnselect event


I would like to change the appearance of the currently selected treeview node by showing a button in the template.  Nodes are selected by clicking.  AllowMultiSelect is turned off.

When a node is no longer the selected node I would like to hide the button.  I am attempting to handle the nodeUnselect event but it doesn't appear to fire when another node is clicked.

Is there a way to handle this event, or is there a different way to determine when a node is no longer the selected node?

Thank you,
Randy Craven

3 Replies

AB Ashokkumar Balasubramanian Syncfusion Team April 5, 2017 01:24 PM UTC

Hi Randy, 
In our TreeView component unselect event was triggered when enable the allowMultiSelection property, otherwise unselect event was not triggered. So you can achieve your requirement (“Selected node only show the button, other nodes are hide it”) with select event. Please find the below code snippet. 
<script id="treeTemplate" type="text/x-jsrender"> 
        {{if hasChild}} 
        <div class={{>cls}}>{{>name}}</div> 
        <div class="cont-list"> 
            <button class="con-img">{{>imgId}}"</button> 
            <div class="cont-details"> 
                <b>{{>name}}</b><br /> 
                <br /> 
            <div class="treeFooter"></div> 
                fields: { 
                    dataSource: treeData, 
                    id: "id", parentId: "pid", text: "name", hasChild: "hasChild" 
                template: "#treeTemplate", 
                 nodeSelect: function (args) { 
                  // Hide the all buttons inside the tree view  
                   this.element.find('li .con-img').hide(); 
                  // Show the corresponding button for the selected item.  
                ready: function (args) { 
                    this.element.find('li .con-img').hide(); 
For your convenience we have prepared simple sample, please check the sample in below playground location. 
Please let us know, if you have any other concerns. 
Ashokkumar B. 

RC Randy Craven April 5, 2017 06:14 PM UTC

Hello Ashokkumar,

With this information I was able to solve my problem.  Thank you.

Randy Craven

AB Ashokkumar Balasubramanian Syncfusion Team April 6, 2017 04:52 AM UTC

Hi Randy, 
Most welcome. 
Ashokkumar B. 

Live Chat Icon For mobile
Up arrow icon