Laravel 5.2 - ajax check if value exists in database

First make the request.

php artisan make:request AjaxUserExistsRequest

Then open the request file (App\Http\Requests) and find the following:

public function validate(){
    return [
        //rules
    ];
}

This is where you would stick your validation rules so you can check against the form elements being submit.

Then you should use dependency injection to force your request into the first argument of the user_exists() function:

public function user_exists(Requests\AjaxUserExistsRequest $request){
    return User::where('first_name', $request->first_name)->first();
}

This will return nullif no user exists, otherwise we don't care about the response.

Finally, of course we need our route.

Route::post('employee_exists', 'EmployeeController@user_exists');

Lastly, we'll go ahead and capture the form submit and check if the user exists with our jQuery.

$('#employee_form').submit(function(e){
    e.preventDefault();

    var first_name = $('#first_name').val(),
        $this = this; //aliased so we can use in ajax success function

    $.ajax({
        type: 'POST',
        url: '/employee_exists',
        data: {first_name: first_name},
        success: function(data){
           if(data == null){
               //then submit the form for real
               $this.submit; //doesn't fire our jQuery's submit() function
           } else {
               //show some type of message to the user
               alert('That user already exists!');
           }
        } 
    });
});

The below will give alert message the user already exists! if the first_name exists in your db or it will give alret nothing.(if you want to check with superior change the code vice versa)

first make sure you have jquery.min.js in your public folder.

Now in blade.php add id for first_name, last_name, and superior as below:

<form action="../create_employee" method="POST">     
    <button class="button" type="submit" style="float:right"><span>Save</span></button>
    <div style="clear:both"></div>
    <fieldset>
      <legend>Personal data</legend>
        <label for="first_name">First name:</label><input type="text" id="first_name" class="add_emp required" name="first_name" value="" /><br />  
        <label for="last_name">Last name:</label><input type="text" id="last_name" class="add_emp required" name="last_name" value="" /><br />
        <label for="superior">Superior:</label><input type="text" class="add_emp" name="superior" value="" id="superior_list" /><br /> 
    </fieldset> 
</form>

<script>
$(document).ready(function(){
    $("#superior_list").blur(function(){
        var first_name = $('#first_name').val();
        var last_name = $('#last_name').val();
        var superior = $('#superior_list').val();                

        $.ajax({
                type: 'POST',
                url: '/check_superior',
                data: {first_name: first_name, last_name: last_name, superior: superior},
                success: function(data){
                   if(data == 0){
                       alert('nothing');
                   } else {
                       alert('the user already exists!');
                   }
                } 
            });

    });
});
</script>

and in your route.php

Route::post('/check_superior', array('as' => '', 'uses' => 'EmployeeController@check_superior'));

in EmployeeController.php

public function check_superior(){
    // can get last_name, superior like first_name below
    $first_name = Input::get('first_name');
    $data = YourModel::where('first_name',$first_name)->get();
    return count($data);
}

It should work. if it doesn't please show us your error

Give your form an id:

<form action="../create_employee" method="POST" id="employee_form">     
    <button class="button" type="submit" style="float:right"><span>Save</span></button>
    <div style="clear:both"></div>
    <fieldset>
      <legend>Personal data</legend>
        <label for="first_name">First name:</label><input type="text" class="add_emp required" name="first_name" id="first_name" value="" /><br />  
        <label for="last_name">Last name:</label><input type="text" class="add_emp required" name="last_name" value="" /><br />
        <label for="superior">Superior:</label><input type="text" class="add_emp" name="superior" value="" id="superior_list" /><br /> 
    </fieldset> 
</form>

your js will look like this

$('#employee_form').submit(function(e){
    e.preventDefault();
    var first_name = $('#first_name');
    $.ajax({
        method: "POST",
        url: "checkUserExistence.php",
        data: { first_name: first_name }
    })
    .done(function( msg ) {
        if(msg == 'exist') {
            //employee exists, do something...
        } else {
            //employee does not exist, do something...
        }
    });
})  

also add csrf_field in your form to generate token, and use this token while sending request. in your form:

 {{ csrf_field() }}

in your ajax request:

$.ajax({
        headers: {'X-CSRF-Token': $('input[name="_token"]').val()},
        //other data....        
 })

you can also do it with meta teg. in your head teg

<meta name="csrf-token" content="{{ csrf_token() }}">

in your request

$.ajaxSetup({
    headers: {
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content');
         //other data...
    }
});