Данные не отображаются в jquery DataTable

Я пытаюсь получить данные из базы данных и отобразить их в jquery DataTable, но данные не отображаются в DataTable. Таблица

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

просмотреть код страницы

<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>

код контроллера

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
}

код модели

<?php

namespace App;

use Illuminate\Database\Eloquent\Model;

class OrderedBook extends Model
{
    //
}

код маршрута

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

Я думаю, что проблема в javascript-коде DataTable. Но я не уверен. Пожалуйста помоги!!!