A Useful Inline Delete/Confirm UI Pattern
For my personal bookmark service I had to implement the ability to delete bookmarks. I wanted this operation to be easily accessible directly in the list of bookmarks:
When you click on Delete...
the button is replaced with two more buttons: Cancel
and Delete!
:
The mouse cursor – which has not moved – is positioned over the cancel operation so accidental clicks are fine. Clicking on the “Delete!” button really deletes the bookmark.
There is no sudden interruption in contrast with a modal dialog or a popup menu and you can completely ignore the operation and move on.