Confirm delete modal/dialog with Twitter bootstrap?-open source projects twbs/bootstrap
dfsq
For this task you can use already available plugins and bootstrap extensions. Or you can make your own confirmation popup with just 3 lines of code. Check it out.
Say we have this links (note data-href
instead of href
) or buttons that we want to have delete confirmation for:
Delete record #23
Delete record #54
Here #confirm-delete
points to a modal popup div in your HTML. It should have an “OK” button configured like this:
...
...
Cancel
Delete
Now you only need this little javascript to make a delete action confirmable:
$('#confirm-delete').on('show.bs.modal', function(e) {
$(this).find('.btn-ok').attr('href', $(e.relatedTarget).data('href'));
});
So on show.bs.modal
event delete button href
is set to URL with corresponding record id.
Demo: http://plnkr.co/edit/NePR0BQf3VmKtuMmhVR7?p=preview
Bootstrap 2.3
Here is an original version of the code I made when I was answering this question for Bootstrap 2.3 modal.
$('#modal').on('show', function() {
var id = $(this).data('id'),
removeBtn = $(this).find('.danger');
removeBtn.attr('href', removeBtn.attr('href').replace(/(&|\?)ref=\d*/, '$1ref=' + id));
});