Sweetalert2: The Cancel button is automatically selected

Created on 13 Nov 2016  路  3Comments  路  Source: sweetalert2/sweetalert2

Hi,

First, thank you for creating SweetAlert2!

So I got this problem: it seems like the Cancel button is automatically selected, but I don't know why. When I create "new" popups, everything works correctly. I also tried to change the value of allowOutsideClick but the problem persists.

I managed to recreate the issue in JSFiddle with the same exact code, so that's probably an issue on my end, and if it is, I'd like to know what's wrong.

https://jsfiddle.net/ad3quksn/53/

Thanks!

Most helpful comment

You're using a rejection handler on the promise as your trigger to show the English version. However, SweetAlert2 can reject for a number of reasons (basically any reason that isn't "user clicked confirm"): timer ran out, user clicked the background, user clicked the close button, user clicked Esc or user clicked cancel - more info in our readme.

Thing is, you show the English version no matter why the promise was rejected. If you only want to show the English version when the cancel button is clicked, you should check if your rejection handler is given a string of 'cancel' (as described in the link above).

Fixed JSFiddle

All 3 comments

Do you have a bit more information about the issue? I don't see any problem in the linked fiddle, and your description doesn't really tell me exactly what the issue is (does "selected" mean that it's focused, that it's automatically clicked or that it has some hover state?). Possibly include an expected/observed list, or a GIF of the issue.

Hi,

I made a GIF so you can understand what's going on on my end

Actually, it looks like the "Cancel" button isn't automatically selected (focused), but when I click on the "Close" button or outside the box, It's clicked for some reason.

I doubt It's related to my browser (Firefox 50.0) since I also tried on Edge and the same problem occurs.

You're using a rejection handler on the promise as your trigger to show the English version. However, SweetAlert2 can reject for a number of reasons (basically any reason that isn't "user clicked confirm"): timer ran out, user clicked the background, user clicked the close button, user clicked Esc or user clicked cancel - more info in our readme.

Thing is, you show the English version no matter why the promise was rejected. If you only want to show the English version when the cancel button is clicked, you should check if your rejection handler is given a string of 'cancel' (as described in the link above).

Fixed JSFiddle

Was this page helpful?
0 / 5 - 0 ratings

Related issues

Xosmond picture Xosmond  路  3Comments

WillGoldstein picture WillGoldstein  路  3Comments

snsarma picture snsarma  路  3Comments

SasSam picture SasSam  路  3Comments

thelastinuit picture thelastinuit  路  3Comments