Laravel 6 Ajax Request Example

Laravel 6 Ajax Request Example

In this post we will give you information about Laravel 6 Ajax Request Example. Hear we will give you detail about Laravel 6 Ajax Request ExampleAnd how to use it also give you demo for it if it is necessary.

Here, i will guide you how to write jquery ajax form submit in laravel 6. we will write jquery ajax post request laravel 6. we will protect csrf token with ajax request in laravel 6. I will give you very simple example of laravel 6 ajax post request tutorial. you can easily use ajax get request, ajax post request, ajax put request, ajax delete request ect with laravel 6.

Ajax request is a basic requirement of any php project, we are always looking for without page refresh data should store in database and it’s possible only by jquery ajax request. same thing if you need to write ajax form submit in laravel 6 then i will help you how you can pass data with ajax request and get on controller. If you want to see all request example like get, post, delete, put then you can see on laravel 6 ajax crud example, i write few days ago. You can read from here: Laravel 6 Ajax CRUD.

If you want to add ajax request with validation then you can follow this article: Laravel 6 Ajax Form Validation

You have to just do three things to understand how to use ajax request in laravel 6, so just follow this three step and you will learn how to use ajax request in your laravel 6 application.

Step 1: Create Routes

First thing is we put two routes in one for displaying view and another for post ajax. So simple add both routes in your route file.

routes/web.php

Route::get('ajaxRequest', 'AjaxController@ajaxRequest');

Route::post('ajaxRequest', 'AjaxController@ajaxRequestPost')->name('ajaxRequest.post');

Step 2: Create Controller

Same things as above for routes, here we will add two new method for routes. One will handle view layout and another for post ajax request method, so let’s add bellow:

app/Http/Controllers/HomeController.php

<?php

namespace AppHttpControllers;

use IlluminateHttpRequest;

class AjaxController extends Controller

{

/**

* Create a new controller instance.

*

* @return void

*/

public function ajaxRequest()

{

return view('ajaxRequest');

}

/**

* Create a new controller instance.

*

* @return void

*/

public function ajaxRequestPost(Request $request)

{

$input = $request->all();

Log::info($input);

return response()->json(['success'=>'Got Simple Ajax Request.']);

}

}

Also see:Laravel 6 CRUD Application Tutorial

Step 3: Create Blade File

Finally we require to create ajaxRequest.blade.php file and here we will write code of jquery ajax and pass laravel token. So blade file is very important in ajax request. So let’s see bellow file:

resources/views/ajaxRequest.blade.php

<!DOCTYPE html>

<html>

<head>

<title>Laravel 6 Ajax Request example</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 >

<h1>Laravel 6 Ajax Request example</h1>

<form >

<div >

<label>Name:</label>

<input type="text" name="name" placeholder="Name" required="">

</div>

<div >

<label>Password:</label>

<input type="password" name="password" placeholder="Password" required="">

</div>

<div >

<strong>Email:</strong>

<input type="email" name="email" placeholder="Email" required="">

</div>

<div >

<button >Submit</button>

</div>

</form>

</div>

</body>

<script type="text/javascript">

$.ajaxSetup({

headers: {

'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')

}

});

$(".btn-submit").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('ajaxRequest.post') }}",

data:{name:name, password:password, email:email},

success:function(data){

alert(data.success);

}

});

});

</script>

</html>

now you can run your example and see.

You will get output like as bellow:

Output

Also see:Laravel 7/6 Ajax CRUD Tutorial

[2019-09-17 03:54:19] local.INFO: array (

'name' => 'Hardik Savani',

'password' => '123456',

'email' => 'aatmaninfotech@gmail.com',

)

I hope it can help you

Hope this code and post will helped you for implement Laravel 6 Ajax Request Example. if you need any help or any feedback give it in comment section or you have good idea about this post you can give it comment section. Your comment will help us for help you more and improve us. we will give you this type of more interesting post in featured also so, For more interesting post and code Keep reading our blogs

For More Info See :: laravel And github

Leave a Comment

Your email address will not be published. Required fields are marked *

  +  19  =  20

We're accepting well-written guest posts and this is a great opportunity to collaborate : Contact US