Laravel – Confirmation Before Delete Record from Database Example

Laravel – Confirmation Before Delete Record from Database Example

In this post we will give you information about Laravel – Confirmation Before Delete Record from Database Example. Hear we will give you detail about Laravel – Confirmation Before Delete Record from Database ExampleAnd how to use it also give you demo for it if it is necessary.

Hi Guys, In this post we will learn how to open confirm model box before deleting item in laravel 5 application. As we know very well delete operation is very command and basic feature of every web application. Also delete operation is very important part because if you remove item, post, product, category etc then it will remove from your browser. So we should always prefer to confirmation before remove item.

There are several options available to use confirm like jquery ui confirm, sweetalert, bootbox, bootstrap confirmation etc jquery plugin. So we almost use bootstrap theme so it would always better if we use bootstrap plugin for this task. So In this example i am going to use bootstrap confirmation plugin for confirm box like toggle.

bootstrap-confirmation.js provide us very simple and better layout for confirm box and it’s simply use event of their plugin. So let’s see bellow full example and you can implement confirmation before delete record in your web application. you will get layout like as bellow screen shot.

Layout:

Step 1: Add Table and Dummy Records

I always prefer to give example from scratch, So in this example we will create “products” table with id, name, details, created_at and updated_at column. So you have to create table using migration and run that. After created successfully create table, make sure add some dummy data like as bellow:

Products Insert Query:

INSERT INTO 'products' ('id', 'name', 'details', 'created_at', 'updated_at') VALUES

(1, 'Product A', 'Product A Details', NULL, NULL),

(3, 'Product C', 'Product C Details', NULL, NULL),

(4, 'Product D', 'Product D Details', NULL, NULL),

(5, 'Product E', 'Product E Details', NULL, NULL),

(6, 'Product F', 'Product F Details', NULL, NULL);

Step 2: Add New Route

In this step, we are doing from scratch so we will add two routes, one for display data and another for delete request. So you have to simply add two new routes in your laravel application.

routes/web.php

Route::get('myproducts', 'ProductController@index');

Route::delete('myproducts/{id}', 'ProductController@destroy');

Also see:Laravel 5 Autocomplete using Bootstrap Typeahead JS Example with Demo

Step 3: Create ProductController

In third step, we will create new ProductController file to handle request of created two new route. In this Controller we define two method, index() and destroy(). Both method will handle route request. So let’s create new controller and put code:

app/Http/Controllers/ProductController.php

<?php


namespace AppHttpControllers;


use IlluminateHttpRequest;

use DB;


class ProductController extends Controller

{

/**

* Show the application dashboard.

*

* @return IlluminateHttpResponse

*/

public function index()

{

$products = DB::table("products")->get();

return view('products',compact('products'));

}


/**

* Show the application dashboard.

*

* @return IlluminateHttpResponse

*/

public function destroy($id)

{

DB::table("products")->delete($id);

return response()->json(['success'=>"Product Deleted successfully.", 'tr'=>'tr_'.$id]);

}

}

Step 4: Create products blade file

In last step we will create products.blade.php file and write code of display products and jquery ajax code. In this file we added following css and js files:

1)bootstrap.min.css

2)bootstrap.min.js

3)jquery.min.js

4)bootstrap-confirmation.min.js

So, let’s create products.blade.php file and put bellow code:

resources/views/products.blade.php

Also see:jQuery Ajax X-editable bootstrap plugin to update records in PHP Example

<!DOCTYPE html>

<html>

<head>

<title>Laravel 5 - Confirmation before delete records from database example</title>


<!-- Latest compiled and minified CSS -->

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-confirmation/1.0.5/bootstrap-confirmation.min.js"></script>

<meta name="csrf-token" content="{{ csrf_token() }}">


</head>

<body>


<div >

<h3>Laravel 5 - Confirmation before delete records from database example</h3>

<table >

<tr>

<th width="80px">No</th>

<th>Product Name</th>

<th>Product Details</th>

<th width="100px">Action</th>

</tr>

@if($products->count())

@foreach($products as $key => $product)

<tr id="tr_{{$product->id}}">

<td>{{ ++$key }}</td>

<td>{{ $product->name }}</td>

<td>{{ $product->details }}</td>

<td>

<a href="{{ url('myproducts',$product->id) }}"

data-tr="tr_{{$product->id}}"

data-toggle="confirmation"

data-btn-ok-label="Delete" data-btn-ok-icon="fa fa-remove"

data-btn-ok-

data-btn-cancel-label="Cancel"

data-btn-cancel-icon="fa fa-chevron-circle-left"

data-btn-cancel-

data-title="Are you sure you want to delete ?"

data-placement="left" data-singleton="true">

Delete

</a>

</td>

</tr>

@endforeach

@endif

</table>

</div> <!-- container / end -->


</body>


<script type="text/javascript">

$(document).ready(function () {

$('[data-toggle=confirmation]').confirmation({

rootSelector: '[data-toggle=confirmation]',

onConfirm: function (event, element) {

element.trigger('confirm');

}

});


$(document).on('confirm', function (e) {

var ele = e.target;

e.preventDefault();


$.ajax({

url: ele.href,

type: 'DELETE',

headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},

success: function (data) {

if (data['success']) {

$("#" + data['tr']).slideUp("slow");

alert(data['success']);

} else if (data['error']) {

alert(data['error']);

} else {

alert('Whoops Something went wrong!!');

}

},

error: function (data) {

alert(data.responseText);

}

});


return false;

});

});

</script>


</html>

Ok, now we are ready to run above example with great layout. So let’s run on following url: Site_URL+’/myproducts’.

I hope it can help you….

Hope this code and post will helped you for implement Laravel – Confirmation Before Delete Record from Database Example. if you need any help or any feedback give it in comment section or you have good idea about this post you can give it comment section. Your comment will help us for help you more and improve us. we will give you this type of more interesting post in featured also so, For more interesting post and code Keep reading our blogs

For More Info See :: laravel And github

Leave a Comment

Your email address will not be published. Required fields are marked *

8  +  1  =  

We're accepting well-written guest posts and this is a great opportunity to collaborate : Contact US