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

Unable to change eye icons in child records and parent record.

Thread ID:

Created:

Updated:

Platform:

Replies:

143709 Mar 29,2019 10:39 AM UTC Apr 5,2019 11:43 AM UTC Angular - EJ 2 4
loading
Tags: TreeGrid
Ebenezer
Asked On March 29, 2019 10:39 AM UTC

HI
I am trying to change eye icon based on a click event.
Please see the below stackblitz link.

In the last column i have placed eye icons initially.
I would like to change the icons with (click) = "getData(data)".
Current Behavior: Child icons are changing from eye<=>eye-slash but the parent record is still in previous mode
Expected Behavior:
1. I would like to change icons from eye to eye to eye-slash and vice-versa.
2. If the record has the child records , child records icons must be changed.
3. if the record doesn't has any child records only that corresponding record should changed.

Regards
Justin Ebenezer

Ebenezer
Replied On April 3, 2019 08:21 AM UTC

Hi Syncfusion Team
Can any one provide solution for the below query .


Regards
Justin Ebenezer.

Vignesh Natarajan [Syncfusion]
Replied On April 3, 2019 12:51 PM UTC

Hi Justin Ebenezer, 
 
Thanks for contacting Syncfusion Forums. 
 
Query: “Unable to change eye icons in child records and parent record.” 
 
From your query we understand that you need to change the eye icon based on the child elements. (ie) To change icon of both parent and child node, from eye to eye-slash when a parent node is being clicked and alos to change the icon of the clicked record alone if the record has no child record. 
 
In TreeGrid, we have support for rendering checkbox column from 2019 Volume 1 release. Please refer the below link for help documentation, 
 
 
We have achieved your requirement using check box feature and modified the icon as per your requirement with the help of CSS.  
 
Refer the below style for your reference 
 
.e-grid .e-gridcontent .e-css.e-checkbox-wrapper .e-frame::before,   
.e-grid .e-css.e-checkbox-wrapper .e-frame.e-stop::before { 
  font: normal normal normal 14px/1 FontAwesome; 
  content: '\f06e'; 
} 
.e-grid .e-gridcontent .e-css.e-checkbox-wrapper .e-frame.e-check::before { 
  font: normal normal normal 14px/1 FontAwesome; 
  content: "\f070"; 
} 
.e-grid .e-gridheader .e-hierarchycheckbox span.e-icons { 
  display: none; 
} 
.e-grid .e-gridcontent .e-css.e-checkbox-wrapper span.e-frame  { 
  border: 0px; 
} 
.e-grid .e-gridcontent .e-css.e-checkbox-wrapper .e-frame.e-icons, 
.e-grid .e-gridcontent .e-css.e-checkbox-wrapper:hover .e-frame.e-icons, 
.e-grid .e-gridcontent .e-css.e-checkbox-wrapper .e-frame.e-icons.e-stop 
{ 
  background-color: transparent; 
} 
 
 
 
For your convenience we have prepared a sample which can be referred below 
 
 
please get back to us if you have further queries. 
 
Regards, 
Vignesh Natarajan. 
 


Ebenezer
Replied On April 4, 2019 09:31 AM UTC

Hi Syncfusion Team
Thanks for your response.
Provided Stackblitz link  example is working fine.
But while implementing the same in our application i am getting below error.
Please see the below image for your reference


Farveen Sulthana Thameeztheen Basha [Syncfusion]
Replied On April 5, 2019 11:43 AM UTC

Hi Justin, 

QUERY: Facing parse errors while using checkbox column in my application 

In your query you have mentioned that, you are facing errors while using checkbox column in your application. We suspect that you are using older version of TreeGrid  source. We have provided the checkbox column support  from 2019 Volume 1 Release (release version: v17.1.0.38). 

Could you please upgrade into v17.1.0.38 and after upgrade still facing the issue please get back to us with further details. 

Regards, 
Farveen sulthana T 


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