A simple JS safety-pin confirmation when a delete link is clicked


When developing an admin page for CRUD (Create, Read, Update, Delete) operation, you almost always end up having a list page that displays the record details with an edit and delete button for each record.

Since this page is only applicable to admin, I usually take the simple route of displaying a link that is directly tied to the route responsible for deleting the id indicated in the link. Don't forge that this route/link should be protected so that only the verified admin user can access it.

However, it's very possible that I might end up clicking on the delete link for the wrong record or even by accident. In order to prevent the accidental record deletion/lost, I usually like to add a confirmation for deletion but I want to achieve this with minimum code since after all, this is admin only page that nobody else will see.

This can be achieved with simple javascript as follows:

  // let's assume GET /photo/{id}/delete is the route for deleting the photo associated with id
  <a href="/photo/{{$photo->id}}/delete" onclick="return confirm('are you sure you want to delete {{$photo->filename}}?');">Delete</a>

When the above link is clicked, it will display a javascript prompt message like below:

And if you click on the Cancel button, the browser will ignore the click on the link

I know there are relatively tiny jQuery libraries that can support this type of confirmation in much prettier UI but I just want a quick and dirty function since nobody will see this prompt except me...
Go Back to List Page

Leave a comment

Name : Comment : view emoticons
Please consider signing up for our website.
If you sign up and log in:
  •   You can avoid the "I'm not a robot" captcha when commenting
  •   You can also avoid typing your name every time
  •   You can upload a picture for each comment
  •   You can change or delete your comment within 1 hour
  •   You can track all the comments you posted on this site
  •   You can read blog posts that are only open to members
  •   You can look up blogs using the search feature
  •   More privileges for our friends & families coming...

OK, Sign me up!

Emoticons are a great way to visually express how you feel.
However, there are times when unintended content is converted to emoticon because the content happens to have one of the emoticon symbols. That's why it's always good idea to preview your comment before posting and when you see this type of problem, you can indicate NOT to auto convert.