Dialog buttons spacing and button disabling
-
Hello,
Assuming dialog having two css buttons with classes: 'positive’ - the buttons are too close to each other and stick together. Is it possible to make some space there ? I’ve tried to create the dummy button with label:’ ' but I can’t disable it. Is there some way of disabling buttons in dialogs ?
TIA, Rus
-
Can you be so kind to open a Github request ticket for “Dialog buttons spacing” pls?
Disabling a button makes too little sense… just don’t add it. And from what I understand you are only adding it to hack button spacing. -
Well, disabling/enabling buttons reactively is widely used in UI for usability - for example consider accepting license dialog. Until user check the ‘I’ve read and agreed to the license terms’ checkbox the Accept button must be disabled.
-
@Sfinx thx. yes, but you also have http://quasar-framework.org/components/dialog.html#Buttons-Preventing-Dialog-Close
-
The prevent close behaviour is not related to usability here
While the users see the enabled Agree button - most of them will still try to press it.
-
Would you be so kind to open up a github ticket for the disabling buttons?
This is not so easy as Dialogs use a new instance of Vue (not the app root one – as it’s not injected in your page template [so not precompiled by your app but precompiled when building Quasar distributable itself]). There’s a lot to talk on the subject for a full explanation. Will see what I can do. Thanks! -
Thanks, I will open the issue. The simple way is like:
…
let dlg = new Dialog(… buttons[id:‘agree’, disabled: tue …])
…
dlg.buttons.id(‘agree’).enable()
… -
Agreed on that.