yajra / laravel-datatables

jQuery DataTables API for Laravel
https://yajrabox.com/docs/laravel-datatables
MIT License
4.74k stars 862 forks source link

problems with rendering view using datatables #432

Closed sayyowatsup closed 8 years ago

sayyowatsup commented 8 years ago

Hi,

I am currently using datatables in Laravel 5.2, it seems like I can successfully pass the JSON data but failed to render view. I really dunno wat is wrong here.

Here is my Datatable Controller code:

public function getIndex()
    {
        return view('event.report');
    }

    /**
     * Process datatables ajax request.
     *
     * @return \Illuminate\Http\JsonResponse
     */
    public function anyData(Request $request)
    {
        //$developers = Event::lists('developer','developer');
        $events = Event::select(['name','startDate','endDate','venue','developer','client','agency','allowance']);
        return \Datatables::of($events)
            ->filter(function ($query) use ($request) {
                if ($request->has('name')) {
                    $query->where('developer', 'like', "%{$request->get('name')}%");
                }
            })
            ->make(true);
    }

Here is my view:

@extends('layouts.app')

@section('content')
    <title>Attender Monthly Report Page</title>

    <div class="container">
        {{ Form::open(['url' => '/getreport','id'=>'search']) }}
        {{ Form::label('name', 'Select Developer Name:') }}
        {{ Form::select('developer', ['abc'=>'abc','def'=>'def','123'=>'123'],null,['id' => 'name']) }}
        {{ Form::submit('Search', ['class' => 'btn btn-primary']) }}
        {{ Form::close() }}

        <div class="search">
        <a  href="{{ url('/excel') }}" class="btn btn-primary"><span class="glyphicon glyphicon-save" aria-hidden="true"></span>  Export as Excel</a>
        <table class="table table-hover" id="result">
            <thead>
            <tr>
                <th>Event Name</th>
                <th>Start_Date</th>
                <th>End_Date</th>
                <th>Venue</th>
                <th>Attender</th>
                <th>Client</th>
                <th>Agency</th>
                <th>Allowance</th>

            </tr>
            </thead>
        </table>
            </div>
    </div>
@endsection
@push('scripts')
<script>
    var oTable =
            $('#result').DataTable({
                processing: true,
                serverSide: true,
                ajax: {
                    url: '{{ url('/getreport') }}',
                    data: function (d) {
                        d.name = $('select[name=name]').val();
                    }
                },

                columns: [
                    { data: 'name', name: 'name' },
                    { data: 'startDate', name: 'startDate' },
                    { data: 'endDate', name: 'endDate' },
                    { data: 'venue', name: 'venue' },
                    { data: 'developer', name: 'developer' },
                    { data: 'client', name: 'client' },
                    { data: 'agency', name: 'agency' },
                    { data: 'allowance', name: 'allowance' }
                ]
            });

    $('#search').on('submit', function(e) {
        oTable.draw();
        e.preventDefault();
    });
</script>
@endpush

And here is my route:

  Route::post('/getreport','DatatablesController@anyData');
    Route::get('/viewreport','DatatablesController@getIndex');

This is my JSON data:

{
"draw": 0,
"recordsTotal": 3,
"recordsFiltered": 3,
"data": [
{
"name": "fsdfws",
"startDate": "2016-02-04",
"endDate": "2016-02-06",
"venue": "tgeferg",
"developer": "abc",
"client": "dsfds",
"agency": "dfgdf",
"allowance": "100"
},
{
"name": "sfwef",
"startDate": "2016-03-03",
"endDate": "2016-03-06",
"venue": "fgdgd",
"developer": "def",
"client": "fgdsg",
"agency": "gsdgfes",
"allowance": "234"
},
{
"name": "sfdwseef",
"startDate": "2016-02-03",
"endDate": "2016-02-23",
"venue": "dgegw",
"developer": "123",
"client": "dgsfdse",
"agency": "dgfsdg",
"allowance": "567"
}
],
"queries": [
{
"query": "select count(*) as aggregate from (select '1' as `row_count` from `events`) count_row_table",
"bindings": [],
"time": 11
},
{
"query": "select count(*) as aggregate from (select '1' as `row_count` from `events`) count_row_table",
"bindings": [],
"time": 0
},
{
"query": "select `name`, `startDate`, `endDate`, `venue`, `developer`, `client`, `agency`, `allowance` from `events`",
"bindings": [],
"time": 1
}
],
"input": []
}

And one more thing,if I want my dropdown to display options from developer column in Event Model,how shud I change my code?

yajra commented 8 years ago

@sayyowatsup, you declare your route as post which is causing your issue. Change it to get and it should work fine.

  Route::post('/getreport','DatatablesController@anyData');
// to
  Route::get('/getreport','DatatablesController@anyData');
sayyowatsup commented 8 years ago

Thx for ur help,the prob solved!