edit data in model in laravel

How to edit data in a model in the laravel model using Ajax?

In this tutorial, I will give you an example of How to edit data in a model in the laravel model using Ajax, So you can easily apply it with your laravel 5, laravel 6, laravel 7, laravel 8, and laravel 9 application.

First, what we’re doing here, This is the example :

Let’s create Laravel edit form modal | Display data in modal popup Laravel example

routes\web.php :


use Illuminate\Support\Facades\Route;
use App\Http\Controllers\BookController;

| Web Routes
| Here is where you can register web routes for your application. These
| routes are loaded by the RouteServiceProvider within a group which
| contains the "web" middleware group. Now create something great!
Route::get('/book-list', [BookController::class, 'bookList'])->name('book.list');

app\Http\Controllers\BookController.php :


namespace App\Http\Controllers;
use Session;
use App\Models\Book;
use Illuminate\Http\Request;

class BookController extends Controller

    public function bookList(){
        $books = Book::get();
        return view('example.list',compact('books'));

    public function bookEdit ($id){
         $bookData = Book::find($id);
         return response()->json([
            'status' =>200,
            'bookdata' =>$bookData,

    public function bookUpdate(Request $request){
        $bookData = Book::find($request->book_id);


      <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
      <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
   <!-- Edit Book Modal -->
   <div class="modal fade" id="EditBookModalLabel" tabindex="-1" role="dialog" aria-labelledby="EditBookModalLabel" aria-hidden="true">
      <div class="modal-dialog" role="document">
         <form data-parsley-validate class="form-horizontal form-label-left" action="{{ route('book.update') }}" method="POST">
            <div class="modal-content">
               <div class="modal-header">
                  <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                  <span aria-hidden="true">&times;</span>
               <div class="modal-body" style="width:620px;">
                  <div class="item form-group">
                     <label class="col-form-label col-md-3 col-sm-3 label-align">Book Name
                     <span class="required" style="color:red">*</span>
                      <input type="hidden" name="book_id" id="bookId" value="">
                     <div class="col-md-6 col-sm-6">
                        <input type="text" name="book_name"  id="bookName" value="" required="required" class="form-control">
                  <div class="item form-group">
                     <label class="col-form-label col-md-3 col-sm-3 label-align">Book Status
                     <span class="required" style="color:red">*</span>
                     <div class="col-md-6 col-sm-6 ">
                        <select class="form-control" name="book_status"  id="bookStatus" required="required">
                           <option>Select Status</option>
                           <option value="in_stock">In Stock</option>
                           <option value="out_of_stock">Out of Stock</option>
                           <option value="other">Other</option>
                  <div class="item form-group">
                     <label class="col-form-label col-md-3 col-sm-3 label-align">Book Author
                     <div class="col-md-6 col-sm-6">
                        <input type="text" name="book_author"  id="bookAuthor" value="" class="form-control">
               <div class="modal-footer">
                  <div class="col-md-6 col-sm-6 offset-md-5">
                     <button class="btn btn-danger" type="reset">Reset</button>
                     <button type="submit" class="btn btn-success">Update</button>
      <div class="container">
         <h3>Laravel edit form modal | Display data in modal popup Laravel example</h3>
         <table class="table table-bordered">
            @if(isset($books) && !empty($books))
            @foreach ($books as $key => $book )
               <td>{{ $key+1 }}</td>
               <td>{{ $book->book_name }}</td>
               <td>{{ $book->book_author }}</td>
               <td>{{ $book->book_status }}</td>
                  <button type="button" data-toggle="modal" data-target="#EditBookModalLabel" value="{{ $book->id }}" class="btn btn-warning btn-xs editbtn" style="margin-right:5px;">
                  <span class="glyphicon glyphicon-pencil" aria-hidden="true"></span>
            var book_id = $(this).val();

Read also:- Laravel Ajax autocomplete search.

Run application :

In this article, we learned “How to edit data in a model in the laravel model using Ajax”, I hope this article will help you with your Laravel application Project.

Read also:- Laravel Excel export with the header row.

Hi, My name is Gaurav Pandey. I'm a Laravel developer, owner of 8Bityard. I live in Uttarakhand - India and I love to write tutorials and tips that can help other developers. I am a big fan of PHP, Javascript, JQuery, Laravel, WordPress. connect@8bityard.com