Hello!
I would like to add message verifcation in JS to ask the user “Are you sure you want to perform this action?” before it’s making the action (in my case - removing some user details in PHP)
how I can do that?
You could use a confirm dialogue.
@felgall ;
I have heard you say these are only for debugging purposes.
Is there an alternative that I have overlooked?
confirm, alert, prompt and the likes block the browser and therefore are considered bad practice by many (not to demonize, I use them myself sometimes, but it’s nice to be aware of it and follow better standars if the project allows it). of course they’re super good for debugging/prototyping.
the alternative is simply an html modal/popup.
obviously it can’t be used the same way since it’s not-blocking and “asyncronous” so you’d have to refactor using callbacks, or, if you’re super cool, promises
Thanks.
So what is a better way of confirming if a user really wants to perform an action (for example to ensure that they didn’t click on ‘delete’ by mistake)?
Edit:
I see you updated your answer to include HTML modal. Could you point me to an example of what you mean?
You can omit putting a submit type button for the form. Then you use a normal button type instead, display a dialog on click, and only .submit() the form if the dialog returns the sure value.
It helps if the confirmation dialog is modal: http://jqueryui.com/dialog/#modal-message.
the better way is simply to show a custom, relatively positioned div (and maybe fade the rest of the page to black) with buttons, like
or making your own.
If you do things smartly you will keep a single one in the DOM and change its message and buttons labels as you need, while binding the appropriate function callbacks to handle the pressing of the buttons.
That’s definitely the right way to do it.
The confirm dialog is considered by some browsers to be for debugging purposes and so may display an extra checkbox to aid in debugging - for example by making it easy to turn JavaScript off.
I use built-in alerts and the such quite often, because making modals accessible, especially for screen readers, is still eating the hottest chicken vindaloo and pooping it out in an endless trial of fire and dirty poophacks.
Some day the modal dialog will be built into the browser where it belongs, instead of the long string of cringeworthy a11y-hacks and manual keyboard focus it is now.
That said, I’m always pleased when I run across some plugin thingie where someone took the time to do all the hacks for me. I’m looking for a lighbox-container for dialogs and popups and have seen a few now with keyboard-traps, default-escapes, multi-language keybindings (even control keys often aren’t the same code across different-language keyboards, so even listening for ENTER can be complicated depending on who you’re supporting) and the like.
But I’m still of the opinion that developers on the front shouldn’t have to be building these wheels over and over again.
Also, the fact that everything stops until that confirm/alert/whatever is dealt with, is sometimes exactly what you want, which should also help you decide which type you’d want to use.