Skip to content
Switch branches/tags

Latest commit


Git stats


Failed to load latest commit information.
Latest commit message
Commit time

Ajax Workflow for Laravel

  • Provides useful tools for working with AJAX requests & JSON responses.
  • Unobtrusive - Same behaviour for non-AJAX requests with single code (no if statements)
  • YES - it can be used for processing FORMs via AJAX out of the box!
  • Invalid FormRequests display HTML validation errors both to ErrorBagContainer and FormGroup (Optional)
    • Uses Bootstrap CSS Form semantics. Compatible with Bootstrap 3 & 4.
  • Support clientside @section redraw and redirects. @see Ajax Service
  • Only dependencies are jQuery1.8> and Laravel 4>


  1. Copy source code to your existing App - directories should match service Namespace
  1. register service provider and Facade (Optional) in your config/app.php
'providers' => [
'aliases' => [
	'Ajax' => \App\Services\Ajax\Facade\Ajax::class,
  1. Copy App/Services/Ajax/laravel.ajax.js to your public/js directory or run command
php artisan vendor:publish --tag=public --force
  1. Edit your master.blade.php
  <meta name="_token" content="{!! csrf_token() !!}"/>
  <script src="/js/laravel.ajax.js"></script>

you can use browserify require('laravel.ajax'); in your app.js



to send your FORMs and LINKs by AJAX just add ajax class

<form action="" class="ajax">
<a href="ajax/my-action" class="ajax">

If we want redraw some html after AJAX request

<div id='snippet'>

<!-- In case that we want redraw section-->
<div id='mySection'>


Ajax Service provides you a Factory for your response. It is designed to simplify your work and communication with frontend.

Ajax Service recognize if request is XmlHttpRequest and return JsonResponse, in other case returns regular Http\Response or Http\RedirectResponse

Getting service

//Dependency injection with TypeHint
public function redraw(\App\Services\Ajax\Ajax $ajax) {
	$ajax = app('ajax'); //by resolving from IoC container
	$ajax = \Ajax::instance();  //Using Facade

Redrawing Views

	$ajax->redrawView('snippet'); //if we want simply redraw some HTML
	$ajax->appendView('snippet'); //if we want to append HTML instead of replace
	return $ajax->view('partials/_snippet', $data )
	// we can redraw even @section(s) - @yield() must be wrappeed with div#sectionName.
	// Use only with good reason, it could be very uneffective.
	return $ajax->redrawSection('mySection')->view('my.template', $data);


public function update(ClientRequest $request, Client $client)
    $request->session()->flash('success', 'Client has been updated.');

	// This is also example of Ajax Facade usage
    return \Ajax::redirect(route('clients.index'));
    return \Ajax:redirectBack()

Sending custom data

public function getData(\App\Services\Ajax\Ajax $ajax) {
	$ajax->json = $data; //setting custom data
	// custom ajax success handler needed -  @see section Configuration and custom AJAX requests
	return $ajax->jsonResponse();

Fluent API

You can utilize fluent API and with some useful methods

Route::get('test',function(\App\Services\Ajax\Ajax $ajax){
	return $ajax
		->setJson([])  //set your custom json data
		->runJavascript('alert("hello");') //evaluate javascript
		->dump() //enable after JSON is delivered
		->alert('test') //alert popup with message
		->jsonResponse() //return JsonResponse... if you have not call view() or redirect()

Configuration and library in depth


<script src="/js/laravel.ajax.js"></script>
    laravel.errors.errorBagContainer = $('#errors');
    laravel.errors.showErrorsBag = true;
    laravel.errors.showErrorsInFormGroup = false;
    laravel.bootstrapVersion = 3;

Extending or modifying laravel.ajax module

    //modifying laravel.ajax handlers globally
    var laravel.ajax.originalSuccessHandler = laravel.ajax.successHandler;
    laravel.ajax.successHandler = function(payload) {
        //custom logic here

        //using one of laravel helpers

        //or call super success handler

    //creating extensions or helper
    laravel.helper = function(){ ...  };

How to create custom AJAX request

You can always use standard $.ajax(options), but this is useful shortcut with JSON ready X-CSRF-Token header set.

        url: "{{ route('my.route) }}",
        type: 'GET', //optional,
        success: function(payload){} //optional - default is laravel.ajax.successHandler
        error: function(event){      //optional - default is laravel.ajax.errorHandler
		...,event); //calling super handler

Ajax success

Ajax success request handler expect JSON containing some of these keys

	redirect: 'absoluteUrl', //page to redirect
	sections: {     //html snippets to be redrawn
	dump: true, // parsed JSON,
	alert: 'message', //alert('message'),
	runJavascript: 'jsCall();', //evaluate javascript code
	scrollTo: 'elementID' //scroll page to element - value is elementID

Ajax error

If FormRequest fails after form validation it sends HTTP response 422 - Unprocessable Entity which is recognized and process with laravel.ajax.errorHandler function. This function recognize which error occurred and automatically displays validation errors to the Form which sent the data...

How to create Validation Error Response manually

public function store()
    $validator = Validator::make(Input::all(), $rules);
	if ($validator->fails()) {
		//if request is AJAX it only sends `422 Error Response` and redirect will not be used..
		//@see previous section
        return \Ajax::redirectWithErrors(route('someRoute'),$validator);


Laravel AJAX forms with validation | Laravel Ajax Toolkit




No releases published


No packages published