delete confirmation in laravel
I have the following code:
@foreach($results as $result)
<tr>
<td>{{$result->my_id}}</td>
<td>{{$result->province_name}}</td>
<td>{{$result->city_name}}</td>
<td>
<a class="btn btn-primary" href="https://stackoverflow.com/questions/32984859/{{route("city-edit', $result->my_id)}}"><i class="fa fa-edit"></i></a>
<a class="btn btn-danger" href="https://stackoverflow.com/questions/32984859/{{route("city-delete', $result->my_id)}}"><i class="fa fa-trash"></i></a>
</td>
</tr>
@endforeach
How to add a confirmation on delete each data?
I prefer a more easier way, just add onclick="return confirm('Are you sure?')", as bellow:
<a class="btn btn-danger" onclick="return confirm('Are you sure?')" href="https://stackoverflow.com/questions/32984859/{{route("city-delete', $result->my_id)}}"><i class="fa fa-trash"></i></a>
If this is your link:
<a href="#" class="delete" data-confirm="Are you sure to delete this item?">Delete</a>
Use this Javascript:
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');
}
});
}
Note: the <a> needs the delete in class.
This solution uses Unobtrusive JavaScript and should work with IE 9 or newer.
<a class="btn btn-danger" onclick="return myFunction();" href="https://stackoverflow.com/questions/32984859/{{route("city-delete', $result->my_id)}}"><i class="fa fa-trash"></i></a>
<script>
function myFunction() {
if(!confirm("Are You Sure to delete this"))
event.preventDefault();
}
</script>
<a href="https://stackoverflow.com/questions/32984859/{{ route("city-delete', $result->my_id) }}"
class="btn btn-danger" data-method="DELETE" data-confirm="Are you sure?"> Delete</a>
With brexis/laravel-data-method package, you can specify appropriate HTTP method and a confirmation text.
This is helpful if you have this for example into your routes file:
Route::get('cities/{city}', '[email protected]')->name('city-show');
Route::delete('cities/{city}', '[email protected]')->name('city-delete');
If this is your link:
<a href="https://stackoverflow.com/questions/32984859/{{route("venuepropertyarea.delete', ['propertyarea' => $propertyareaname->id])}}" data-method="DELETE" data-confirm="Are you sure to delete this item?" class="btn btn-danger btn-xs pull-right delete"><i class="fa fa-trash"></i> </a>
Route:
Route::get('/icrm/venues/property_area/delete/{propertyarea}', '[email protected]')->name('venuepropertyarea.delete');
Use this Javascript:
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');
}
});
}
Note: the <a> needs the delete in class.
This solution uses Unobtrusive JavaScript and should work with IE 9 or newer.
index.blade.php
<form action="https://stackoverflow.com/questions/32984859/{{route("todos.destroy', $todo->Id)}}" method="post">
<input type="hidden" name="_method" value="DELETE">
@csrf
<button id="btnDelete"class="btn btn-danger btn-sm">Delete</button>
</form>
<script type="javascript">
document.onsubmit=function(){
return confirm('Sure?');
}
</script>
I used pure PHP Form, the method DELETE has to be passed as hidden on the submit page action, so I catch it trough javascript and I get the confirmation alert.
