yajrabox datatable

1-composer require yajra/laravel-datatables-oracle

2-config/app.php


'providers' => [Yajra\Datatables\DatatablesServiceProvider::class,

 'aliases' => ['Datatables' => Yajra\Datatables\Facades\Datatables::class,
3- php artisan vendor:publish
4-php artisan tinker
>>> factory(App\People::class, 50)->create();

5-Route::get('my-datatables', 'PeopleController@index');
Route::get('get-data-my-datatables','PeopleController@getData')->name('get.data');

6- make controller
personcontroller-
<?php

namespace App\Http\Controllers;

use App\People;
use Illuminate\Http\Request;
use DB;
use Yajra\Datatables\Datatables;


class PeopleController extends Controller
{/**
     * Displays front end view
     *
     * @return \Illuminate\View\View
     */
    public function index()
    {
    return view('datatable');
    }
    /**
     * Process ajax request.
     *
     * @return \Illuminate\Http\JsonResponse
     */
    public function getData()
    {
         return Datatables::of(People::query())->make(true);
    }

             public function searchItem(Request $request)
              {
                 if($request->ajax())
                {

                    $output="";

        $peoples=DB::table('peoples')->where('name','LIKE','%'.$request->search."%")
         ->orWhere('email','LIKE','%'.$request->search."%")
         ->orWhere('id','LIKE','%'.$request->search."%")->get();
        if($peoples)
    {
    foreach ($peoples as $key => $people) {
    $output.='<tr>'.
    '<td>'.$people->id.'</td>'.
    '<td>'.$people->name.'</td>'.
    '<td>'.$people->email.'</td>'.
    '</tr>';
    }
    return Response($output);
 }
}
}
    public function delete(Request $request){
        if ($request->ajax()){
            People::destroy($request->id);
        }
    }

    public function update(Request $request){
        if ($request->ajax()){
            $people = People::find($request->id);
            $people->name = $request->input('name');
            $people->email = $request->input('email');

            $people->update();
            return response($people);
        }
    }
}

7-make blade file

datatable.blade.php-

<!DOCTYPE html>

<html lang="en">

    <head>

        <meta charset="utf-8">

        <meta http-equiv="X-UA-Compatible" content="IE=edge">

        <meta name="viewport" content="width=device-width, initial-scale=1">

        <title> DataTables  </title>

        <link href="//netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet">

        <link rel="stylesheet" type="text/css" href="{{asset('css/jquery.dataTables.min.css')}}">

       

    </head>

    <body>

        <div class="container">

            <br/>

            <h1 class="text-center">DATATABLE </h1>

            <br/>

            

            <table class="table table-bordered" id="people-table">

                <thead>

              

             <div class="panel-body">

 

            <div class="form-group">

 

            <input type="text" class="form-controller" id="search" name="search">you can search here</input>

 

            </div>

                    <tr>

                        <th>Id</th>

                        <th>Name</th>

                        <th>Email</th>

                    

                

   

                        </th>

                        </tr>

                       

                </thead>

            </table>

        </div>

        <script src="//code.jquery.com/jquery.js"></script>

       <script src="{{asset('js/jquery.dataTables.min.js')}}"></script>

<!--  -->

        <script>

        $(function() {

            $('#people-table').DataTable({

                processing: true,

                serverSide: true,

                ajax: '{!! route('get.data') !!}',

                columns: [

                    { data: 'id', name: 'id' },

                    { data: 'name', name: 'name' },

                    { data: 'email', name: 'email' },

                ]

            }); 

        });

 $("#add").click(function() {

            $.ajax({

            type: 'post',

            url: '/addItem',

            data: {

            '_token': $('input[name=_token]').val(),

            'name': $('input[name=name]').val()

            },

            success: function(data) {

            if ((data.errors)) {

            $('.error').removeClass('hidden');

            $('.error').text(data.errors.name);

            } else {

            $('.error').remove();

            $('#people-table').append("<tr class='item" + data.id + "'><td>" + data.id + "</td><td>"

                + data.name + "</td><td><button class='edit-modal btn btn-info' data-id='" + data.id + "' data-name='" + data.name + "'><span class='glyphicon glyphicon-edit'></span> Edit</button> <button class='delete-modal btn btn-danger' data-id='" + data.id + "' data-name='" + data.name + "'><span class='glyphicon glyphicon-trash'></span> Delete</button></td></tr>");

            }

            },

            });

            $('#name').val('');

            });

           

            </script>

<script type="text/javascript"> 

 $('#search').on('keyup',function(){                     

    $value=$(this).val();

 $.ajax({          

type : 'get',                    

url : '/search',

data:{'search':$value}, 

success:function(data){

$('tbody').html(data);

    }

 });

})

 </script>

                     

<script type="text/javascript">

                     

 $.ajaxSetup({ headers: { 'csrftoken' : '{{ csrf_token() }}' } });

                     

</script>

<script>

$(document).on('click', '.delete', function(){

                var id = $(this).data('id');

                $('#deletemodal').modal('show');

                $('#deletepeople').val(id);

            });

                

                $('#deletepeople').click(function(){

                var id = $(this).val();

                $.post("{{ URL::to('delete') }}",{id:id}, function(){

                    $('#deletemodal').modal('hide');

                    showPeople();

                })

            });

 

                $(document).on('click', '.update', function(){

                var id = $(this).data('id');

                var name = $(this).data('name');

                var email = $(this).data('email');

                $('#editmodal').modal('show');

                $('#name').val(name);

                $('#email').val(email);

                $('#id').val(id);

            });

 

                $('#editpeople').on('submit', function(e){

                e.preventDefault();

                var form = $(this).serialize();

                var url = $(this).attr('action');

                $.post(url,form,function(data){

                    $('#editmodal').modal('hide');

                    showPeople();

                })

            });

 

              function showPeople(){

            $.get("{{ URL::to('show') }}", function(data){

                $('#personBody').empty().html(data);

            })

        }

</script>

    

        @stack('scripts')

      

    </body>

</html>

run program 

php artisan serve