vex confirm dialog, cancel-action as default

Question

I'm trying to use https://github.com/HubSpot/vex modal script for a confirm-dialog. At the moment, if the confirm dialog box appeares, the "ok"-button is selected as default. Do anybody know how i can change this? I'd like the the cancel-button is for default so that anybody hit just enter, nothing happens.

thanks for your answer.

best regards thomas

Answer 1

set the text of the buttons in your array

vex.dialog.open({          
    message: 'Are you absolutely sure you want to destroy the alien planet?', 
    overlayClosesOnClick: false, // set false to click out
    callback: function (value) {
        console.log(value);
    },
    buttons: [
        $.extend({}, vex.dialog.buttons.YES, { text: 'Your Button For Yesy' }),
        $.extend({}, vex.dialog.buttons.NO, { text: 'Your Button For No' })
    ]
 });

Answer 2

To modify this as default behaviour, change the order of the buttons and class name in the vex JavaScript file. (vex.combined.js)

This will make the 'Cancel' button the default button.

dialog.buttons = { 
        NO: {
          text: 'Cancel',
          type: 'button',
          className: 'vex-dialog-button-primary',
          click: function noClick () {
            this.value = false
            this.close()
          }
        },
        YES: {
          text: 'OK',
          type: 'submit',
          className: 'vex-dialog-button-secondary',
          click: function yesClick () {
            this.value = true
          }
        }
}

dialog.defaultOptions = {
    ..
    buttons: [
      dialog.buttons.NO,
      dialog.buttons.YES
    ],
    ..
  }