Simple JQuery Ajax Request Example with Laravel 6

Today, We want to share with you Simple JQuery Ajax Request Example with Laravel 6.In this post we will show you JQuery Ajax Post Request Example in Laravel 6, hear for Simple Ajax request example with JQuery and Laravel we will give you demo and example for implement.In this post, we will learn about Laravel 6 jQuery Ajax Form Submit With Validation with an example.

Simple JQuery Ajax Request Example with Laravel 6

There are the Following The simple About How to make an AJAX call to a Laravel 6 controller function / method Full Information With Example and source code.

As I will cover this Post with live Working example to develop jQuery Ajax POST example with Laravel 6, so the Laravel 6 Ajax Request is used for this example is following below.

Phase 1: Create Routes

routes/web.php

Read Also:  how to refresh a div using javascript without refreshing page?

Route::get('getMembersData', '[email protected]');
Route::post('getMembersData', '[email protected]')->name('getMembersData.post');

Phase 2: Create Controller

app/Http/Controllers/MemberController.php

<?php
  
namespace App\Http\Controllers;
use Illuminate\Http\Request;
   
class MemberController extends Controller
{
    /**
     * Create a new controller instance.
     *
     * @return void
     */
    public function getMembersData()
    {
        return view('getMembersData');
    }
   
    /**
     * Create a new controller instance.
     *
     * @return void
     */
    public function getMembersDataPost(Request $request)
    {
        $input = $request->all();
        \Log::info($input);
   
        return response()->json(['success'=>'Your all Member Data get Successfully.']);
    }
   
}

Phase 3: Create Blade File

resources/views/getMembersData.blade.php

<!DOCTYPE html>
<html>
<head>
    <title>Laravel 6 jQuery Ajax Request example - www.pakainfo.com</title>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link href="//netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet">
    <script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
    <meta name="csrf-token" content="{{ csrf_token() }}" />
</head>
<body>
  
    <div class="container">
        <h1>PHP Laravel 6 Ajax Request example - www.pakainfo.com</h1>
  
        <form >
  
            <div class="form-group dsp">
                <label>Name:</label>
                <input type="text" name="name" class="form-control jdk" placeholder="Enter Your Name" required="">
            </div>
  
            <div class="dsp form-group">
                <label>Password:</label>
                <input type="password" name="password" class="form-control jdk" placeholder="Enter Your Password" required="">
            </div>
   
            <div class="dsp form-group">
                <strong>Email:</strong>
                <input type="email" name="email" class="form-control jdk" placeholder="Enter Your Email" required="">
            </div>
   
            <div class="dsp form-group">
                <button class="btn btn-success get-members-store">Submit</button>
            </div>
  
        </form>
    </div>
  
</body>
<script type="text/javascript">
   
    $.ajaxSetup({
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        }
    });
   
    $(".get-members-store").click(function(e){
  
        e.preventDefault();
   
        var name = $("input[name=name]").val();
        var password = $("input[name=password]").val();
        var email = $("input[name=email]").val();
   
        $.ajax({
           type:'POST',
           url:"{{ route('getMembersData.post') }}",
           data:{name:name, password:password, email:email},
           success:function(data){
              alert(data.success);
           }
        });
  
	});
</script>
   
</html>

Final Output

Read Also:  laravel 6 Retrieve data using jQuery Ajax

[2022-11-11 03:54:19] local.INFO: array (
  'name' => 'Virat Kohali',
  'password' => 'DSF8787878',
  'email' => '[email protected]',
)  

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 Create Live Search In Laravel 6 Using 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.