Dialog HTML buttons click event attachment not working

[Ernesto Yoon]

Hello,

the issue I'm experiencing with the dialog is as follows:

I have an ejs-dialog with a set of two simple buttones and a ng-template block as content.:

<ejs-dialog... >

     <e-buttons>

         <e-dialogbutton [buttonModel]='dlgButtons[0]' (click)="dlgAddBtnClick($event)"></e-dialogbutton>

         <e-dialogbutton [buttonModel]='dlgButtons[1]' (click)="dlgCancelBtnClick($event)"></e-dialogbutton>

     </e-buttons>

     <ng-template #content>...<ng-template #content>

The button model array is:

public dlgButtons: ButtonModel[] = [

    { content: 'Apply Changes', isPrimary: true, disabled: !this.isReady },

    { content: 'Cancel', cssClass: 'e-flat' }

  ];

And I can see both buttons rendered as expected with the corresponding labels, but both click event methods don't work.

.

If I set both buttons with the [buttons] property of the dialog component using the following object as property, then click on buttons work.

public dlgButtons: ButtonPropsModel[] = [

    { click: this.dlgAddBtnClick.bind(this), buttonModel: { content: 'Apply Changes', isPrimary: true } },

    { click: this.dlgCancelBtnClick.bind(this), buttonModel: { content: 'Cancel', cssClass: 'e-flat' } }

  ];

I read a similar issue in Blazor, but in that case it was by using a footer template, which differs from this case.

Could you advise please?

Thank you.

[Revanth Krishnan]

Hi Ernesto, 

 

 

Greetings from Syncfusion support. 

 

We are currently validating your query with high priority, we will update you with further details on or before 28^th April. 

 

We appreciate your patience till then. 

 

Regards, 

Revanth 

[Revanth Krishnan]

Hi Ernesto, 

 

As we are facing complexity in finding the root cause, we will update you with further details on or before 3^rd May 2021. 

 

We appreciate your patience till then. 

 

Regards, 

Revanth 

[Revanth Krishnan]

Hi Ernesto,  

  

  

Good day to you  

  

  

We have validated your query and have considered “Click event binding not working when button is rendered as tags(<e-buttons>) in the dialog” as a bug from our end and logged the report for the same and the fix will be included in our patch release on 18th  May 2021.      

        

You can now track the current status of the report, review the proposed resolution timeline, and contact us for any further inquiries through this link: https://www.syncfusion.com/feedback/24988 

 

Note: Please use the ‘buttons’ property until the above issue is fixed. 

 

Regards,  

Revanth 

[Revanth Krishnan]

Hi Ernesto, 

 

 

Sorry for the inconvenience. 

 

 

We couldn’t include the issue the feature for “Click event binding not working when button is rendered as tags(<e-buttons>) in the dialog” due to its complexity. We will include the fix, with our patch release on 25^th May 2021. 

   

We appreciate your patience until then. 

 

Regards, 

Revanth 

[Revanth Krishnan]

Hi Ernesto, 

 

 

Sorry for the inconvenience. 

 

 

As we are facing complexity in fixing the reported issue, we will include this issue fix in the coming patch release on 1^st June 2021. 

We appreciate your patience till then. 

 

Regards, 

Revanth 

[Revanth Krishnan]

Hi Ernesto, 

 

 

Thanks for the patience. 

 

 

We have resolved the reported issue “Click event binding not working when button is rendered as tags(<e-buttons>) in the dialog” with the package version 19.1.66.      

Can you please upgrade your package to this version to resolve the issue on your end? 

 

Release Note: https://ej2.syncfusion.com/angular/documentation/release-notes/19.1.66/?type=all#dialog 

 

Sample: https://stackblitz.com/edit/angular-jwjtep-njzvqf?file=app.component.ts 

 

Regards, 

Revanth