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: November 16, 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Double Click not working on third level

Thread ID:





131658 Jul 21,2017 12:55 PM UTC Jul 28,2017 11:11 AM UTC Angular 5
Tags: ejGrid
Robert Bakos
Asked On July 21, 2017 12:55 PM UTC


I have the need to use three levels grids. Everything is working fine except no events are registered for the grid of the third level. 

What am I doing wrong?

I have attached the source code.

The behavior can be tested at http://rechnungskontrolle.azurewebsites.net/fetch-data/2. The double click on the first row work. After expanding the double click on third row of the child grid works. After expanding the next level the double click does not work.

Any ideas why not?



Attachment: fetchdata_a9519355.zip

Seeni Sakthi Kumar Seeni Raj [Syncfusion]
Replied On July 24, 2017 12:22 PM UTC

Hi Robert,  
We have checked the given Hosted site. We could see the third level Grid is not assigned a function for recordDoubleClick. Refer to the following screenshot taken from the hosted site.  
So, we suggested to ensure this at your end whether the recordDoubleClick is assigned a valid function.  
Seeni Sakthi Kumar S. 

Robert Bakos
Replied On July 24, 2017 05:50 PM UTC

Thank you for your reply! 

I believe the scope of the functions within type script is not working correctly. The assignment of the event handler works, if I do the following:

            recordDoubleClick: onInvoiceRecordDoubleClick// this.onInvoiceRecordDoubleClick
        function onInvoiceRecordDoubleClick(e) {

So there is a differnce between using this.onInvoiceRecordDoubleClick which is defined within the class and using the function, which is defined within the scope of onInvoiceDetailsDataBound.

I don't understand why the code for the second level is working but not for the third.



Thavasianand Sankaranarayanan [Syncfusion]
Replied On July 27, 2017 03:46 AM UTC

Hi Robert, 

Sorry for the inconvenience caused. 

We have analyzed your query and we are able to reproduce the reported issue from our end. By default if we pass the event as “this.name” then “this” have added context of that Grid models with in. For this type of hierarchical Grid, we used to define using the arrow function defining. 

Refer the below code example. 

export class AppComponent { 
       detailsDataBound(e: any) { 
              dataSource: data, 
              recordDoubleClick: (e: any) => this.secondleveldbl(e), 
              detailsDataBound: (e: any) => this.databundeventss(e), 
              detailsTemplate : "#Gridcontents", 
     databundeventss(e: any) { 
             allowPaging: true, 
              dataSource: ejmpdata, 
              recordDoubleClick: (e: any) =>  this.thirdleveldbl(e), 
                 secondleveldbl(e:any) { 

We have prepared a sample and it can be downloadable from the below location. 

Refer the general solution link 

Thavasianand S. 

Robert Bakos
Replied On July 27, 2017 03:56 PM UTC

Thank you very, much!

Again great support!!!

Maybe you could update the example at the Angular section so other developers won't run into the same issue?

You can close this issue.



Saravanan Arunachalam [Syncfusion]
Replied On July 28, 2017 11:11 AM UTC

Hi Robert,  
Thanks for your update.            
We are happy that the provided information helped you. 
Saravanan A. 


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