Question

我正在尝试从数据库中获取数据并显示在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');

我认为问题出在DataTable javascript代码上。但我不确定。请帮忙!!!

Answer 1

此行定义，“正在处理”：true，“服务器端”：true ，您是否正在使用服务器端数据表。

请点击下面的链接以实施。

Server side datatable using laravel

Answer 2

尝试更改

 for (const selectItem1 of this.mwork.text){ 
             this.textq = selectItem1.Question;       
               for (const selectItem2 of this.mwork.text){
                      this.texto = selectItem2.options;      
                    }     
        }

Answer 3

尝试用这样的引号包裹您的AJAX路线，

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

Answer 4

name索引也需要在columns上显示，例如：

"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"},
 ]

将双引号从data而不是"data"改为data。

因此，如果需要，您可以复制并粘贴以上代码。

数据未显示在jQuery DataTable中

4 个答案: