DataTables警告:表id=DataTables_Table_0 - Ajax错误- Laravel
当我试图用我的laravel项目设置数据时，我得到了一个错误。
DataTables警告:表id=DataTables_Table_0 - Ajax错误。有关此错误的更多信息，请参见 。
这是我的控制器。
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\Transaction;
use DataTables;
use Illuminate\Support\Facades\DB;
class TestTableController extends Controller
{
public function index()
{
return view('testtable');
}
public function getTestTable(Request $request)
{
if ($request->ajax()) {
$data = DB::table('transactions')->get();
return Datatables::of($data)
->addIndexColumn()
->addColumn('action', function($row){
$actionBtn = '<a href="javascript:void(0)" class="edit btn btn-success btn-sm">Edit</a> <a href="javascript:void(0)" class="delete btn btn-danger btn-sm">Delete</a>';
return $actionBtn;
})
->rawColumns(['action'])
->make(true);
}
}
}这是我的路线。
Route::get('testtable', [TestTableController::class, 'index']);
Route::get('testtable/list', [TestTableController::class, 'getTestTable'])->name('testtable.list');视图/刀片。
<body>
<div class="container mt-5">
<h2 class="mb-4">Laravel 7|8 Yajra Datatables Example</h2>
<table class="table table-bordered yajra-datatable">
<thead>
<tr>
<th>ID</th>
<th>Amount</th>
<th>Charge</th>
<th>Action</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
</body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.19.0/jquery.validate.js"></script>
<script src="https://cdn.datatables.net/1.10.21/js/jquery.dataTables.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js">
</script>
<script src="https://cdn.datatables.net/1.10.21/js/dataTables.bootstrap4.min.js">
</script>
<script type="text/javascript">
$(function () {
var table = $('.yajra-datatable').DataTable({
processing: true,
serverSide: true,
ajax: "{{ route('testtable.list') }}",
columns: [
{data: 'id', name: 'id'},
{data: 'amount', name: 'amount'},
{data: 'charge', name: 'charge'},
{
data: 'action',
name: 'action',
orderable: true,
searchable: true
},
]
});
});
</script>这是来自拉拉调试器的错误。
但查询确实有结果。
如果我回显查询，这就是输出。
$data = DB::table('transactions')->get();
echo $data;
我还遗漏了什么？如果我在一个新的新的laravel安装中测试的话，同样的代码也能正常工作。这是一个现有的项目，我尝试实现数据。我想，从当前的项目配置中，一定有什么原因导致了这个问题。
回答 3
Stack Overflow用户
发布于 2021-08-27 07:30:09
getTestTable函数中的代码看起来很好。你进了调试器：
无模型应用程序前端测试表的查询结果
但是getTestTable中的代码与testtable无关，所以我猜route('testtable.list')不会用到这个函数。原因可能是您在Route::get('testtable/{id}',...之前放置了一个类似于Route::get('testtable/list',的路由，所以当您调用testtable/list时，它将使用list作为id，然后转到其他函数。
如果我的猜测是正确的，您可以将testtable/list放在testtable/{id}路由之前来修复它。
Stack Overflow用户
发布于 2021-08-26 13:05:59
我与我的项目中的示例代码共享完整的详细信息，下面的示例代码是来自我的项目的管理角色DataTable。请一步一步地参考并试着理解它。
首先，您需要使用下面的Composer命令安装Laravel
作曲家需要yajra/laravel-datatables oracle
然后像我的示例代码一样在web.php中定义路由之后
Route::get('/', [\App\Http\Controllers\Admin\RoleController::class, 'index'])->name('admin.roles.index'); //index all the data view...
Route::post('/', [\App\Http\Controllers\Admin\RoleController::class, 'getIndexUsers'])->name('admin.roles.getIndexRoles'); //Get Users for Laravel Yajra Datatable Index Page record...然后，在为其创建视图文件之后，我将共享项目中的示例。
<div class="card-body">
<table id="role_table" class="table table-bordered table-striped w-100">
<thead>
<tr>
<th>No.</th>
<th>Role Name</th>
<th>Role Slug</th>
<th>Action</th>
</tr>
</thead>
<tfoot>
<tr>
<th>No.</th>
<th>Role Name</th>
<th>Role Slug</th>
<th>Action</th>
</tr>
</tfoot>
</table>
</div>
<!-- /.card-body -->&在页脚脚本中，为初始化DataTable定义函数，如下所示，
<script type="text/javascript">
var dataTable = $('#role_table').DataTable({
lengthMenu: [[10, 25, 50, -1], [10, 25, 50, "All"]],
processing: true,
serverSide: true,
order: [],
searchDelay: 500,
"scrollX": "auto",
"responsive": true,
// "lengthChange": false,
"autoWidth": true,
ajax: {
url: '{{ route("admin.roles.getIndexRoles")}}',
type: 'post',
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
},
data: function (data) {
// data.fromValues = $("#filterUserType").serialize();
},
},
columns: [
{data: 'SrNo', //try with data: 'SrNo' OR data: 'id',
render: function (data, type, row, meta) {
// return meta.row + meta.settings._iDisplayStart + 1;
return meta.row + 1;
}, searchable: false, sortable: false
},
{data: 'role_name', name: 'role_name'},
{data: 'role_slug', name: 'role_slug'},
{data: 'action', name: 'action', searchable: false, sortable: false},
],
});
</script>然后在控制器中加载Yajra DataTable类以供使用
使用Yajra\DataTables\DataTables；//用于Laravel DataTable JS.
现在，为显示视图文件创建如下函数，
public function index()
{
return view('admin.roles.index');
}现在，我为Ajax请求提供了DataTable初始化的函数方法
public function getIndexUsers(Request $request)
{
$roles = Role::select('roles.*');
if($request->order ==null){
$roles->orderBy('id', 'desc');
}
$detail_data = $roles;
return Datatables::of($detail_data)
->addColumn('action', function ($data) {
return $this->DataTableAction($data);
})
->rawColumns(['action'])
->make(true);
}
public function DataTableAction($data){
$btn = '<div class="btn-group">';
if($data->id == "1" || $data->id == "2"){
$btn .= '<button type="button" class="btn btn-danger dropdown-toggle ml-2" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" disabled>Action
</button>';
}else{
$btn .= '<button type="button" class="btn btn-danger dropdown-toggle ml-2" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Action
</button>';
}
$btn .= '<div class="dropdown-menu">';
$btn .= '<a class="dropdown-item" href="'.route('admin.roles.edit',$data->id).'" style="color: black;" onmouseover=\'this.style.background="#dee2e6"\' onmouseout=\'this.style.background="none"\'><i class="far fa-edit text-primary"></i> Edit</a>';
$btn .= '<div class="dropdown-divider"></div>';
$btn .= '<a role_id="'.$data->id.'" class="dropdown-item deleteRole" href="#" style="color: black;" onmouseover=\'this.style.background="#dee2e6"\' onmouseout=\'this.style.background="none"\'><i class="far fa-trash-alt text-danger"></i> Delete</a>';
$btn .= '</div>
</div>';
return $btn;
}重要注意事项：-目前使用的是Laravel 8，因此无需在config/app.php中定义。但是如果您在不同的Laravel版本中有任何错误，那么您将需要在config/app.php中定义.要定义它，请执行以下步骤
**
注意，以下步骤不是强制性的，它取决于您的Laravel版本。
**
config/app.php
.....
'providers' => [
....
Yajra\DataTables\DataTablesServiceProvider::class,
]
'aliases' => [
....
'DataTables' => Yajra\DataTables\Facades\DataTables::class,
]
.....然后在命令下面运行
php构件优化
如果遇到任何问题，请使用
如果您在config/app.php中定义了Service &运行优化命令，那么
Laravel将在autoload中加载它，当您的代码引用尚未加载的类或接口时，会自动调用该类或接口，我不确定< code >J237
Stack Overflow用户
发布于 2021-08-24 22:20:33
如果应用程序代码中的所有内容都正常，您可以松开yajra的配置。因此，要配置它，您可以转到app根目录中的config文件夹，然后从那里打开app.php文件，并将这一行添加到提供程序。
Yajra\DataTables\DataTablesServiceProvider::class结果会是这样的：
'providers' => [
..
..
..
Yajra\DataTables\DataTablesServiceProvider::class,
]并将这一行添加到别名中：
Yajra\DataTables\Facades\DataTables::class
就像这样：
'aliases' => [
..
..
..
..
'DataTables' => Yajra\DataTables\Facades\DataTables::class,
]最后，像上面那样保存文件(config\app.php)，然后打开cmd或终端，然后尝试使用fallowing命令清除应用程序缓存的文件(包括配置缓存)：
php artisan optimizehttps://stackoverflow.com/questions/68825240
复制相似问题
腾讯云开发者
