How can I show a confirmation notice before deleting something?

Problem

When I click delete, I want a confirmation message (this maybe a button or an image). If the user selects ‘Ok,’ the deletion is completed; otherwise, if the user picks ‘Cancel,’ nothing happens.

When the button was pressed, I attempted echoing this, but echoing things causes my input boxes and text boxes to lose their styles and designs.

Asked by Shyam K

Solution #1

Put this in the button’s onclick event:

var result = confirm("Want to delete?");
if (result) {
    //Logic to delete the item
}

Answered by Ved

Solution #2

You can make greater use of the following:

 <a href="url_to_delete" onclick="return confirm('Are you sure you want to delete this item?');">Delete</a>

Answered by Raghav Rach

Solution #3

This is how you would do it using unobtrusive JavaScript and an HTML confirmation message.

<a href="/delete" class="delete" data-confirm="Are you sure to delete this item?">Delete</a>

This is plain vanilla JS, compatible with Internet Explorer 9+:

var deleteLinks = document.querySelectorAll('.delete');

for (var i = 0; i < deleteLinks.length; i++) {
  deleteLinks[i].addEventListener('click', function(event) {
      event.preventDefault();

      var choice = confirm(this.getAttribute('data-confirm'));

      if (choice) {
        window.location.href = this.getAttribute('href');
      }
  });
}

Visit http://codepen.io/anon/pen/NqdKZq to see it in action.

Answered by DevAntoine

Solution #4

function ConfirmDelete()
{
  return confirm("Are you sure you want to delete?");
}


<input type="button" onclick="ConfirmDelete()">

Answered by user1697128

Solution #5

It’s incredibly easy to do and just requires one line of code.

<a href="#" title="delete" class="delete" onclick="return confirm('Are you sure you want to delete this item')">Delete</a>

Answered by Mohammed Muzammil

Post is based on https://stackoverflow.com/questions/9139075/how-to-show-a-confirm-message-before-delete