Edit Data With Bootstrap Modal Window In Laravel

Hello Artisan

In this i will discuss about how to edit data with Bootstrap modal window in Laravel. In this tutorial i won't do crud, i will just show you how you can edit data using bootstrap modal in Laravel. We will show data in modal laravel with pop up.

If you edit data using bootstrap modal then no need to visit another page or no need to create edit page in Lararvel. So you will learn how to pass data from controller to modal in laravel. You will be clear after completing this how to display data in modal popup laravel tutorial.

Let's start our how to edit data in laravel with modal tutorial.

Step 1 : Create Route

In this step we need to create route for creating edit data with bootstarp modal. So create it.


Route::get('/', 'TestController@index')->name('root');
Route::get('/color/{id}/edit', 'TestController@update')->name('color.update');
Route::post('/color/{id}', 'TestController@edit')->name('color.edit');


Step 2 : Create Controller 

In this step we have to create test controller. So create it and then paste this below code to edit data with modal in laravel.


namespace App\Http\Controllers;

use App\Category;
use Illuminate\Http\Request;

class TestController extends Controller
    public function index()
    	$category = Category::all();
    	return view('home',compact('lija'));

    public function update($id)
    	$category = Category::find($id);

	    return response()->json([
	      'data' => $category

    public function edit(Request $request, $id)
        'id' => $id
        'name' => $request->name,

      return response()->json([ 'success' => true ]);



Step 3 : Create View

Now in this final step we have to create our home.blade.php. so create it and paste this below code.



Read also : Laravel 7.x Ajax CRUD Example with Sweet Alert


Hope it can help you.


#laravel #laravel-8x #laravel-7x #modal #bootstrap #edit-modal #jquery