Dialog footer always flat buttons.

I am using  the dialog control. I am adding buttons like this:

            buttons: [
                { click: this.clickCancel, buttonModel: { content: "No"} },
                { click: this.clickConfirm, buttonModel: { content: "Yes", type: "Button", cssClass: 'e-primary'  } },
            ],

The dialog is adding the e-flat class to both buttons even though I haven't asked for them. How can I stop that?

I did notice this in the styling of buttons in the documentation (https://ej2.syncfusion.com/vue/documentation/dialog/style/)

/* To specify font color, background color and border color */
.e-btn.e-flat.e-primary, .e-css.e-btn.e-flat.e-primary {
    background-color: transparent;
    border-color: transparent;
    color: blue;
}

But I just don't want the class name in there at all. I don't really want to define a full footer template. I didn't ask it to add "e-flat" so would just like it to not add it :-)

Thanks

Jeff


4 Replies 1 reply marked as answer

RK Revanth Krishnan Syncfusion Team April 9, 2021 11:34 AM UTC

Hi Jeff, 
 
 
Greetings from Syncfusion support. 
 
 
We have validated your query and we have already considered “Provide support to disable the Dialog's button flat appearance” as a feature request from our end and logged the report for the same and the fix will be included in the patch release on 14th April.  
  
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/24105 
 
Regards, 
Revanth 



IS Indrajith Srinivasan Syncfusion Team April 13, 2021 01:50 PM UTC

Hi Jeff, 
 
Thanks for your patience, 
 
We have provided the support “Provide support to disable the Dialog's button flat appearance with the package version 19.1.56. Check the below links and sample for reference. 
 
Code: 
 
 
buttons: [ 
        { 
          click: this.dlgButtonClick, 
          buttonModel: { content: "OK", isPrimary: true }, 
          //Disable flat appearence 
          isFlat: false, 
        }, 
] 
 
 
 
 
Can you please upgrade your package to this version to use the support provided? 
 
Regards, 
Indrajith 


Marked as answer

JB Jeff Butterworth April 14, 2021 03:31 AM UTC

Hi

I really appreciate how fast you got this out, your support really is outstanding. However, we are locked into the specific version of SyncFusion we are using for the moment so I can't really test this out. I was able to find a workaround in my specific case (by removing the e-flat class after the button is created) but I am sure other users will find this useful in the future.

Regards

Jeff



RK Revanth Krishnan Syncfusion Team April 14, 2021 10:17 AM UTC

Hi Jeff, 
 
Thank for the update. 
 
We are glad that you found the workaround solution for this issue. Please let us know if you need any further assistance. 
 
Regards, 
Revanth 


Loader.
Up arrow icon