data is not displaying in jquery DataTable

Question

I am trying to fetch data from database and display in jquery DataTable but the data is not displaying in DataTable. Table is

ordered_books with attributes 'BookID', 'BilledNum','BilledDate', 'Qunatity', 'Price', 'Remarks'

view page code

<table id="showBooksIn" class="table table-bordered">
    <thead>
        <tr>
            <th>BOOK ID</th>
            <th>BILLED DATE</th>
            <th>BILLED NUMBER</th>
            <th>QUANTITY</th>
            <th>PRICE</th>
            <th>REMARKS</th>
        </tr>
    </thead>
</table>

<script type="text/javascript">
    $(document).ready(function(){
        $('#showBooksIn').DataTable({
            "processing":true,
            "serverside":true,
            "ajax":{{route('data')}}
            "columns":[
                {"data": "BookID"},
                {"data": "BilledNum"},
                {"data": "BilledDate"},
                {"data": "Qunatity"},
                {"data": "Price"},
                {"data": "Remarks"},
            ]
        });
    });
</script>

controller code

public function index()
    {
        return view('pages.booksin', $this->fetchData());
    }

function fetchData()
{
    $ordered_books = OrderedBook::select('BookID', 'BilledNum','BilledDate', 'Qunatity', 'Price', 'Remarks');
    return Datatables::of($ordered_books)->make(true); //return an instance of the class or interface you request
}

model code

<?php

namespace App;

use Illuminate\Database\Eloquent\Model;

class OrderedBook extends Model
{
    //
}

route code

Route::resource('/order','OrderedBookController');
Route::get('/order/data','OrderedBookController@fetchData')->name('data');

I think the problem is with DataTable javascript code. But I am not sure. Please help!!!

hitesh makodiya · Accepted Answer · 2018-07-20 11:22:24Z

1

This line define,"processing":true,"serverside":true, are you using server side datatable.

Please follow bellow link to implement.

Server side datatable using laravel

answered Jul 20, 2018 at 11:22

hitesh makodiya

4372 silver badges14 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Aman Kumar · Accepted Answer · 2018-07-20 11:23:05Z

1

Try after change

"ajax":{{route('data')}} to ajax: '{!! URL("/data") !!}',

answered Jul 20, 2018 at 11:23

Aman Kumar

4,5573 gold badges21 silver badges40 bronze badges

Comments

mmabdelgawad · Accepted Answer · 2018-07-20 11:25:21Z

0

Try to wrap your AJAX route with quotes like this,

'{!! route("data") !!}'

answered Jul 20, 2018 at 11:25

mmabdelgawad

2,5452 gold badges9 silver badges16 bronze badges

Comments

Razib Al Mamun · Accepted Answer · 2018-07-20 12:49:47Z

0

also name index need to on columns as like:

"columns":[
   {data: "BookID", name: "BookID"},
   {data: "BilledNum", name: "BilledNum"},
   {data: "BilledDate", name: "BilledDate"},
   {data: "Qunatity", name: "Qunatity"},
   {data: "Price", name: "Price"},
   {data: "Remarks", name: "Remarks"},
 ]

removed double quotation from data instead of "data" to data.

So, if need to you can copy and paste above code.

answered Jul 20, 2018 at 12:49

Razib Al Mamun

2,7111 gold badge18 silver badges24 bronze badges

Collectives™ on Stack Overflow

data is not displaying in jquery DataTable

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related