Quasar: $q.dialog confirmation with cancel as default action

Created on 21 Nov 2019 · 3Comments · Source: quasarframework/quasar

Is your feature request related to a problem? Please describe.

Yes, a usability one. Confirmation of important modification or deletion actions should have the cancel option as a default in particular in case the user happens to type the Enter key without paying too much attention to the dialog message.

Describe the solution you'd like

A property to indicate the desired default option, perhaps something like:

        this.$q.dialog({
          title: 'Confirm',
          message: `Are you sure to delete this entity....?`,
          color: 'negative',
          ok: `Yes, I'm sure`,
          cancel: true,
          default: 'cancel'   // <<<<
        }).onOk(() => ... )

Describe alternatives you've considered

An alternative is to have the ability to disable the Enter key (and sorry if this is already possible with $q.dialog --couldn't find anything for this in the docs); but still, it would be great to at least have the desired option pre-selected somehow.

(One other alternative, but not ideal, is "simply" to circumvent $q.dialog and write my own component for this functionality; but this seems like it shouldn't be necessary given that $q.dialog already provides almost all of the relevant functionality).

feature request

Source

carueda

Most helpful comment

It would be even better if we could customize the left-right order of cancel button.

yuanyesong on 28 Nov 2019

👍2

All 3 comments

@carueda you can use a custom dialog component https://quasar.dev/quasar-plugins/dialog#Invoking-custom-component, you can pass your own props that you can handle in your custom component.