Today, We want to share with you laravel 6 Update Data in AJAX CRUD.In this post we will show you Update data from database using Laravel and Ajax, hear for Update data from database using Laravel framework we will give you demo and example for implement.In this post, we will learn about CRUD (Create Read Update Delete) in a Laravel 6 App with an example.
laravel 6 Update Data in AJAX CRUD
There are the Following The simple About Insert Update and Delete record from MySQL in Laravel 6 Full Information With Example and source code.
As I will cover this Post with live Working example to develop update data in laravel using model, so the update record in laravel using eloquent is used for this example is following below.
Step 1: Define a Laravel Route
web.php (route)
Route::resource('/memberInformation','MemberInfoController');
Step 2: Make a controller in Laravel
memberInformationConstroller.php (controller)
public function edit($id) { $memberInformation = MemberInfo::find($id); return view('memberInformation.edit',compact('memberInformation','id')); } public function update($id) { $memberInformation = MemberInfo::find($id); $memberInformation->type = request('type'); $memberInformation->name = request('name'); $memberInformation->email = request('email'); $memberInformation->mobile = request('mobile'); $memberInformation->address = request('address'); $memberInformation->save(); return json_encode(array('statusCode'=>200)); }
Step 3: Create a laravel Model
memberInformation.php (Model)
class MemberInfo extends Model { protected $table = 'members_details'; protected $fillable = [ 'type','name', 'email','mobile','address' ]; }
Step 4: Blade Edit View File
edit.blade.php
@extends('memberInformation.layout') @section('content') <div class="row"> <div class="col-lg-12 margin-tb"> <div class="pull-left"> <h2>Edit Member</h2> </div> <div class="pull-right"> <a class="btn btn-primary" href="{{ route('memberInformation.index') }}"> Back</a> </div> </div> </div> @if ($errors->any()) <div class="alert alert-danger"> <strong>Whoops!</strong> There were some problems with your input.<br><br> <ul> @foreach ($errors->all() as $error) <li>{{ $error }}</li> @endforeach </ul> </div> @endif {{-- <form action="{{ route('memberInformation.update',$memberInformation->id) }}" method="POST"> --}} {{-- {{ csrf_field() }} {{ method_field('PATCH') }} --}} <div class="row"> <div class="col-xs-12 col-sm-12 col-md-12"> <div class="form-group cart-jdk"> <strong>Member First Name:</strong> <input type="text" id="name" name="name" value="{{ $memberInformation->name }}" class="form-control custom-dsp" placeholder="Member First Name"> </div> </div> <div class="col-xs-12 col-sm-12 col-md-12"> <div class="form-group cart-jdk"> <strong>Email ID:</strong> <input type="text" class="form-control custom-dsp" id="email" name="email" value ="{{ $memberInformation->email }}" placeholder="Email ID"> </div> </div> <!-- mobile --> <div class="col-xs-12 col-sm-12 col-md-12"> <div class="form-group cart-jdk"> <strong>Mobile:</strong> <input type="text" class="form-control custom-dsp" id ="mobile" name="mobile" value ="{{ $memberInformation->mobile }}" placeholder="Mobile Number"> </div> </div> <!-- address--> <div class="col-xs-12 col-sm-12 col-md-12"> <div class="form-group cart-jdk"> <strong>Address:</strong> <input type="text" class="form-control custom-dsp" id = "address" name="address" value ="{{ $memberInformation->address }}" placeholder="address"> </div> </div> <!-- --> <div class="col-xs-12 col-sm-12 col-md-12 text-center"> <button class="btn btn-primary" id="update_data" value="{{ $memberInformation->id }}">Submit</button> </div> </div> {{-- </form> --}} <script> $(document).ready(function(){ $(document).on("click", "#update_data", function() { var url = "{{URL('memberInformation/'.$memberInformation->id)}}"; var id= $.ajax({ url: url, type: "PATCH", cache: false, data:{ _token:'{{ csrf_token() }}', type: 3, name: $('#name').val(), email: $('#email').val(), mobile: $('#mobile').val(), address: $('#address').val() }, success: function(responseOutput){ responseOutput = JSON.parse(responseOutput); if(responseOutput.statusCode) { window.location = "/memberInformation"; } else{ alert("Internal Server Error"); } } }); }); }); </script> @endsection
Step 5: Layout File
layout.blade.php
<!DOCTYPE html> <html lang="{{ app()->getLocale() }}"> <head> <title>PHP Laravel 6 CRUD using jQuery Ajax</title> <!-- Fonts --> <link href="https://fonts.googleapis.com/css?family=Raleway:100,600" rel="stylesheet" type="text/css"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> </head> <body> <div class="container"> @yield('content') </div> </body> </html>
Web Programming Tutorials Example with Demo
Read :
Summary
You can also read about AngularJS, ASP.NET, VueJs, PHP.
I hope you get an idea about laravel 6 Update data using jQuery Ajax.
I would like to have feedback on my infinityknow.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.