Laravel 5.7 Delete Confirm Bootstrap jQuery Model

Laravel Redirect To Another URL / Web Page - HTTP Laravel Redirects

Today, We want to share with you Laravel 5.7 Delete Confirm Bootstrap jQuery Model.In this post we will show you Delete Modal Popup with Laravel 5.7, Bootstrap and jQuery, hear for Laravel 5.7 – Confirmation before delete record from database example we will give you demo and example for implement.In this post, we will learn about Laravel 5.7 – confirmation box for delete a member from database with an example.

Laravel 5.7 Delete Confirm Bootstrap jQuery Model

There are the Following The simple About Laravel 5.7 Delete Confirm Bootstrap jQuery Model Full Information With Example and source code.

Read Also:  Laravel Helper Functions with Examples

As I will cover this Post with live Working example to develop , so the Use bootstrap dynamic modal for delete confirmation (laravel 5.7) for this example is following below.

Step : 1 Define Route

routes/web.php

Route::get('products', '[email protected]')->name('products');
Route::delete('products/{id}', '[email protected]')->name('product-delete');

Step : 2 Create Laravel Controller

app/Http/Controllers/ProductController.php file in

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use DB;
use Session;

class ProductController extends Controller
{
    /**
     * Show the application dashboard.
     *
     * @return \Illuminate\Http\Response
     */
    public function index()
    {
        $products = DB::table("products")->get();
        return view('products',compact('products'));
    }

    /**
     * Show the application dashboard.
     *
     * @return \Illuminate\Http\Response
     */
    public function destroy($id)
    {
    	DB::table("products")->delete($id);
    	Session::put('success', 'Your Record Deleted Successfully.');
    	return redirect()->route('products');
    }
}

Step : 3 Define a Laravel blade/view File

resources/views/product.blade.php

@extends('layouts.app')
@section('content')
<div class="container">
    <div class="row">
        <div class="col-md-8 col-md-offset-2">
            <div class="panel panel-default">
                @if ($message = Session::get('success'))
                <div class="product-default-alerts alert alert-success fade in">
                    <button type="button" class="close"></button>
                    {!! $message !!}
                </div>
                
                @endif                
                <div class="panel-heading">All Posts</div>
                <div class="panel-body">
                    <table class="table table-bordered">
                    	<thead>
                    		<tr>                    			
	                    		<th>Title</th>
	                    		<th>Description</th>
	                    		<th>Action</th>
                    		</tr>
                    	</thead>
                    	<tbody>
                            @foreach($product as $key => $value)
                                <tr>
                                    <td>{!! $value->title !!}</td>
                                    <td>{!! $value->description !!}</td>
                                    <td>
                                        <a class="btn btn-danger waves-effect waves-light remove-record">id) !!}" data-id="{{$value->id}}" data-target="#product-default-width-modal">Delete</a>
                                    </td>
                                </tr>
                            @endforeach                            
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- Delete Product Model -->
<form action="" method="POST" class="product-delete-record-model">
    <div id="product-default-width-modal" class="modal fade" role="dialog">
        <div class="modal-dialog" style="width:55%">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close">×</button>
                    <h4 class="modal-title" id="product-default-width-modalLabel">Delete Record</h4>
                </div>
                <div class="modal-body">
                    <h4>You Want You Sure Delete This Record?</h4>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default waves-effect remove-data-from-delete-form">Close</button>
                    <button type="submit" class="btn btn-danger waves-effect waves-light">Delete</button>
                </div>
            </div>
        </div>
    </div>
</form>
@endsection

@section('script')

@endsection	

Step : 4 Main product-default.js File include

public/product-default.js

$(document).ready(function(){
	// For A Delete Record Popup
	$('.remove-record').click(function() {
		var id = $(this).attr('data-id');
		var url = $(this).attr('data-url');
		var token = CSRF_TOKEN;
		$(".product-delete-record-model").attr("action",url);
		$('body').find('.product-delete-record-model').append('');
		$('body').find('.product-delete-record-model').append('');
		$('body').find('.product-delete-record-model').append('');
	});

	$('.remove-data-from-delete-form').click(function() {
		$('body').find('.product-delete-record-model').find( "input" ).remove();
	});
	$('.modal').click(function() {
		// $('body').find('.product-delete-record-model').find( "input" ).remove();
	});
});

Run Laravel Project

php artisan serve
http://localhost:8000/products

Angular 6 CRUD Operations Application Tutorials

Read :

Read Also:  Simple Jquery Ajax Pagination with Laravel 5.7 Example

Summary

You can also read about AngularJS, ASP.NET, VueJs, PHP.

I hope you get an idea about Laravel 5.7 Delete Confirm Bootstrap jQuery Model.
I would like to have feedback on my Pakainfo.com blog.
Your valuable feedback, question, or comments about this article are always welcome.
If you enjoyed and liked this post, don’t forget to share.

About Pakainfo

I am Jaydeep Gondaliya, a software engineer, the founder and the person running Pakainfo. I'm a full-stack developer, entrepreneur and owner of Pakainfo.com. I live in India and I love to write tutorials and tips that can help to other artisan, a Passionate Blogger, who love to share the informative content on PHP, Javascript, JQuery, Laravel, Codeigniter, VueJS, AngularJS and Bootstrap from the early stage.

View all posts by Pakainfo →

Leave a Reply

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