Your Web News in One Place

Help Webnuz

Referal links:

Sign up for GreenGeeks web hosting
March 29, 2022 06:27 am GMT

Delete Record using jQuery Ajax in Laravel 8

Originally posted @ https://codeanddeploy.com visit and download the sample code: https://codeanddeploy.com/blog/laravel/delete-record-using-jquery-ajax-in-laravel-8

In this post, I'm sharing how to delete records using jquery ajax in Laravel 8. Usually, the ajax request is implemented so that our web page will not reloading after deleting the record.

In this example, we have a controller, model, route, and blade. Just continue to read the below steps:

Route:

Route::resource('posts', PostsController::class);

Controller:

/*** Remove the specified resource from storage.** @param  \App\Models\Post  $post* @return \Illuminate\Http\Response*/public function destroy(Post $post){    $post->delete();    return response('Post deleted successfully.', 200);}

Model:

<?phpnamespace App\Models;use Illuminate\Database\Eloquent\Factories\HasFactory;use Illuminate\Database\Eloquent\Model;class Post extends Model{    protected $fillable = [        'title',        'description',        'body'    ];    use HasFactory;}

Blade:

<!DOCTYPE html>    <html>    <head>        <meta charset="utf-8" />        <meta name="csrf-token" content="{{ csrf_token() }}">        <meta http-equiv="X-UA-Compatible" content="IE=edge">        <title>Delete Record using Ajax in Laravel 8 - codeanddeploy.com</title>        <meta name="viewport" content="width=device-width, initial-scale=1">        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css">        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>        <script type="text/javascript">          $(document).ready(function() {            $('.delete-form').on('submit', function(e) {              e.preventDefault();              $.ajax({                  type: 'post',                  headers: {                      'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')                  },                  url: $(this).data('route'),                  data: {                    '_method': 'delete'                  },                  success: function (response, textStatus, xhr) {                    alert(response)                    window.location='/posts'                  }              });            })          });        </script>    </head>    <body>        <div class="container mt-5">            @if(Session::get('success', false))              <?php $data = Session::get('success'); ?>              @if (is_array($data))                  @foreach ($data as $msg)                      <div class="alert alert-success" role="alert">                          <i class="fa fa-check"></i>                          {{ $msg }}                      </div>                  @endforeach              @else                  <div class="alert alert-success" role="alert">                      <i class="fa fa-check"></i>                      {{ $data }}                  </div>              @endif            @endif            <table class="table table-striped" id="users-table">              <thead>                <tr>                  <th scope="col">Title</th>                  <th scope="col">Description</th>                  <th scope="col">Body</th>                  <th scope="col">Delete</th>                </tr>              </thead>              <tbody>                @foreach($posts as $post)                  <tr>                    <td>{{$post->title}}</td>                    <td>{{$post->description}}</td>                    <td>{{$post->body}}</td>                    <td>                        <form method="post" class="delete-form" data-route="{{route('posts.destroy',$post->id)}}">                            @method('delete')                            <button type="submit" class="btn btn-danger btn-sm">Delete</button>                        </form>                    </td>                  </tr>                @endforeach              </tbody>            </table>        </div>    </body></html>

I hope this tutorial can help you. Kindly visit here https://codeanddeploy.com/blog/laravel/delete-record-using-jquery-ajax-in-laravel-8 if you want to download this code.

Happy coding :)


Original Link: https://dev.to/codeanddeploy/delete-record-using-jquery-ajax-in-laravel-8-4ok6

Share this article:    Share on Facebook
View Full Article

Dev To

An online community for sharing and discovering great ideas, having debates, and making friends

More About this Source Visit Dev To