带有数据表的Laravel 5.4

Question

I have added this package https://github.com/yajra/laravel-datatables into my package and i am trying to use it in my application.

This is the view

@section('content')
    <table class="table table-bordered" id="users-table">
        <thead>
            <tr>
                <th>Emp No</th>
                 <th>Birth Date</th>
                  <th>First Name</th>
                   <th>Last Name</th>
                    <th>Gender</th>
                     <th>Hire Date</th>

            </tr>
        </thead>
    </table>
@stop

@push('scripts')

<script type="text/javascript">
$(function() {
    $('#users-table').DataTable({
        processing: true,
        serverSide: true,
        responsive: true,
        ajax: 'http://localhost:8000/tasks',
        columns: [
            { data: 'emp_no', name: 'emp_no' }
            { data: 'birth_date', name: 'birth_date' },
            { data: 'first_name', name: 'first_name' },
            { data: 'last_name', name: 'last_name' },
            { data: 'gender', name: 'gender' },
            { data: 'hire_date', name: 'hire_date' }
        ]
    });
});
</script>

@endpush
@endsection

This is the route

Route::get('tasks', 'PrototypeController@getTasks')->name('datatable.tasks');

This is the controller

public function getTasks()
    {
       return Datatables::of(Employees::query())->make(true);
       //returns json
    }

This code loads the view containining the datatables.

The url http://localhost:8000/tasks returns the json in the web browser but the datatable is never rendered in my view. When i check in my view, there are no browser errors.

What could be the problem?.

Answer 1

Create two method, one display our view and other method that will process our datatables ajax request.

Display our view

public function viewTasks()
{
    return view('Tasks.index');
}

Process our datatables ajax request

public function getTasks()
{
    return Datatables::of(Employees::query())->make(true);
}

Reference Link :- Yajra Datatable

Answer 2

You should change in your controller. Add code below for showing data table:

 public function task()
    {
        return view('datatables.Index');
    }

Change in web.php file for add new route:

Route::get( 'employee','PrototypeController@task');

Add data table CDN and bootstrap also

<link href="https://datatables.yajrabox.com/css/app.css" rel="stylesheet">
    <link href="https://datatables.yajrabox.com/css/datatables.bootstrap.css" rel="stylesheet">
    <link href='https://fonts.googleapis.com/css?family=Lato:400,700,300|Open+Sans:400,600,700,800' rel='stylesheet'
          type='text/css'>