I am successfully deleting records in my table using the code below. My only problem, I want it to prompt the user to confirm the action before deleting.
{{link_to_route('individualprofiles.edit', 'Edit', array($ip->id))}}
{{Form::open(array( 'route' => array( 'individualprofiles.destroy', $ip->id ), 'method' => 'delete', 'style' => 'display:inline'))}}
{{Form::submit('D', array('class' => 'btn btn-danger'))}}
{{Form::close()}}
STEP – 1
First of all, you need to add bootstrap.css
file using a link tag, jQuery
and bootstrap.js
file using a script tag in your head section of your web page. On bootstrap’s website, you would find details about this. It’s also possible to build a customized file with selected components from here if you don’t want to use full bootstrap framework.
STEP – 2
Add following html code in a file and save it as a separate file, for example delete_confirm.php
<!-- Modal Dialog -->
<div class="modal fade" id="confirmDelete" role="dialog" aria-labelledby="confirmDeleteLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title">Delete Parmanently</h4>
</div>
<div class="modal-body">
<p>Are you sure about this ?</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
<button type="button" class="btn btn-danger" id="confirm">Delete</button>
</div>
</div>
</div>
</div>
Also, paste following JavaScript code in the same file as well
<!-- Dialog show event handler -->
$('#confirmDelete').on('show.bs.modal', function (e) {
$message = $(e.relatedTarget).attr('data-message');
$(this).find('.modal-body p').text($message);
$title = $(e.relatedTarget).attr('data-title');
$(this).find('.modal-title').text($title);
// Pass form reference to modal for submission on yes/ok
var form = $(e.relatedTarget).closest('form');
$(this).find('.modal-footer #confirm').data('form', form);
});
<!-- Form confirm (yes/ok) handler, submits form -->
$('#confirmDelete').find('.modal-footer #confirm').on('click', function(){
$(this).data('form').submit();
});
STEP – 3
Now, in any page where you want to use this confirm modal dialog, just include it using require_once
or include_once
like:
// other code
require_once('delete_confirm.php');
STEP – 4
To build a delete action button you may use something like this:
<form method="POST" action="http://example.com/admin/user/delete/12" accept-charset="UTF-8" style="display:inline">
<button class="btn btn-xs btn-danger" type="button" data-toggle="modal" data-target="#confirmDelete" data-title="Delete User" data-message="Are you sure you want to delete this user ?">
<i class="glyphicon glyphicon-trash"></i> Delete
</button>
</form>
For more information check this article
By using 'onsubmit' => "return confirm('Are you sure you want to delete?')"
inside Form::open
.
{{Form::open(array(
'route' => array( 'individualprofiles.destroy', $ip->id ),
'method' => 'delete',
'style' => 'display:inline',
'onsubmit' => "return confirm('Are you sure you want to delete?')",
))}}
{{Form::submit('D', array('class' => 'btn btn-danger'))}}
{{Form::close()}}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With