Laravel 6.5.2, PHP 7.2.26 (7.3.3 рдХреЛ рднреА рдЖрдЬрд╝рдорд╛рдПрдВ) рдФрд░ "yajra / laravel-datatables" рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░реЗрдВ: "v1.5.0"
рдбреЗрдЯрд╛ рддрд╛рд▓рд┐рдХрд╛ рджрд┐рдЦрд╛рдИ рджреЗрддреА рд╣реИ, рд▓реЗрдХрд┐рди рдХреЛрдИ рдбреЗрдЯрд╛ рдирд╣реАрдВ рд╣реИред
рдореЙрдбрд▓ рдЕрдкрд╛рд░реНрдЯрдореЗрдВрдЯ рдореЗрдВ рдбреЗрдЯрд╛ рд╣реЛрддрд╛ рд╣реИред
рдорд╛рд░реНрдЧреЛрдВ
Route::resource('apartments', 'ApartmentController')
рдирд┐рдпрдВрддреНрд░рдХ
<?php
namespace App\Http\Controllers;
use App\Apartment;
use App\DataTables\ApartmentDataTable;
use Yajra\DataTables\Services\DataTable;
class ApartmentController extends Controller
{
public function qindex(ApartmentDataTable $dataTable)
{
return $dataTable->render('apartments.index');
}
}
рд╕реЗрд╡рд╛ рдпреЛрдЧреНрдп
<?php
namespace App\DataTables;
use App\Apartment;
use Illuminate\Database\Eloquent\Builder;
use Yajra\DataTables\DataTableAbstract;
use Yajra\DataTables\Html\Button;
use Yajra\DataTables\Html\Column;
use Yajra\DataTables\Html\Editor\Editor;
use Yajra\DataTables\Html\Editor\Fields;
use Yajra\DataTables\Services\DataTable;
class ApartmentDataTable extends DataTable
{
/**
* Build DataTable class.
*
* <strong i="18">@param</strong> mixed $query Results from query() method.
* <strong i="19">@return</strong> DataTableAbstract
*/
public function dataTable($query)
{
return datatables()
->eloquent($query)
->addColumn('action', 'apartment.action');
}
/**
* Get query source of dataTable.
*
* <strong i="20">@param</strong> Apartment $model
* <strong i="21">@return</strong> Builder
*/
public function query(Apartment $model)
{
return $model->newQuery();
}
/**
* Optional method if you want to use html builder.
*
* <strong i="22">@return</strong> \Yajra\DataTables\Html\Builder
*/
public function html()
{
return $this->builder()
->setTableId('apartment-table')
->columns($this->getColumns())
->minifiedAjax()
->dom('Bfrtip')
->orderBy(1)
->buttons(
Button::make('create'),
Button::make('export'),
Button::make('print'),
Button::make('reset'),
Button::make('reload')
);
}
/**
* Get columns.
*
* <strong i="23">@return</strong> array
*/
protected function getColumns()
{
return [
Column::computed('action')
->exportable(false)
->printable(false)
->width(60)
->addClass('text-center'),
Column::make('id'),
Column::make('address'),
Column::make('created_at'),
Column::make('updated_at'),
];
}
/**
* Get filename for export.
*
* <strong i="24">@return</strong> string
*/
protected function filename()
{
return 'Apartment_' . date('YmdHis');
}
}
рд░рд╛рдп
@extends('layouts.app')
@section('content')
<div class="container py-4">
<div class="row justify-content-center">
<div class="col-md-12">
<div class="card">
<div class="card-header">Table</div>
<div class="card-body">
{{ $dataTable->table() }}
</div>
</div>
</div>
</div>
</div>
</div>
<strong i="7">@endsection</strong>
@push('scripts')
<script src="{{ asset('vendor/datatables/buttons.server-side.js') }}"></script>
{{ $dataTable->scripts() }}
<strong i="8">@endpush</strong>
рдмреНрд░рд╛рдЙрдЬрд╝рд░ рдореЗрдВ рдкрд░рд┐рдгрд╛рдо
<script type="text/javascript">
(function(window,$){window.LaravelDataTables=window.LaravelDataTables||{};window.LaravelDataTables["apartment-table"]=$("#apartment-table").DataTable({"serverSide":true,"processing":true,"ajax":{"url":"","type":"GET","data":function(data) {
for (var i = 0, len = data.columns.length; i < len; i++) {
if (!data.columns[i].search.value) delete data.columns[i].search;
if (data.columns[i].searchable === true) delete data.columns[i].searchable;
if (data.columns[i].orderable === true) delete data.columns[i].orderable;
if (data.columns[i].data === data.columns[i].name) delete data.columns[i].name;
}
delete data.search.regex;}},"columns":[{"data":"action","name":"action","title":"Action","orderable":false,"searchable":false,"width":60,"className":"text-center"},{"data":"id","name":"id","title":"Id","orderable":true,"searchable":true},{"data":"address","name":"address","title":"Address","orderable":true,"searchable":true},{"data":"created_at","name":"created_at","title":"Created At","orderable":true,"searchable":true},{"data":"updated_at","name":"updated_at","title":"Updated At","orderable":true,"searchable":true}],"dom":"Bfrtip","order":[[1,"desc"]],"buttons":[{"extend":"create"},{"extend":"export"},{"extend":"print"},{"extend":"reset"},{"extend":"reload"}]});})(window,jQuery);
</script>
рд╢рд╛рдпрдж рд╕реВрдЪрдХрд╛рдВрдХ рдкрд░ рдПрдХ рдЯрд╛рдЗрдкреЛ?
// should be index
public function qindex(ApartmentDataTable $dataTable)
рдирд╣реАрдВ .... рдореИрдВ рдкрд░реАрдХреНрд╖рдг рдФрд░ рдЧрд▓рддреА рд╕реЗ рдирдХрд▓ рдХреЗ рд▓рд┐рдП рдРрд╕рд╛ рдХрд░рддрд╛ рд╣реВрдВред
рдЖрдкрдХрд╛ рдХреЛрдб рдареАрдХ рд▓рдЧ рд░рд╣рд╛ рд╣реИред рдХрдВрд╕реЛрд▓ рдкрд░ рдХреЛрдИ рддреНрд░реБрдЯрд┐?
рдХрд╣реАрдВ рдХреЛрдИ рддреНрд░реБрдЯрд┐ рдирд╣реАрдВ ...
$ dataTable-> рд╕реНрдХреНрд░рд┐рдкреНрдЯ () рдХреЛрдб рдЙрддреНрдкрдиреНрди:
<script type="text/javascript">(function(window,$){window.LaravelDataTables=window.LaravelDataTables||{};window.LaravelDataTables["apartment-table"]=$("#apartment-table").DataTable({"serverSide":true,"processing":true,"ajax":{"url":"","type":"GET","data":function(data) {
for (var i = 0, len = data.columns.length; i < len; i++) {
if (!data.columns[i].search.value) delete data.columns[i].search;
if (data.columns[i].searchable === true) delete data.columns[i].searchable;
if (data.columns[i].orderable === true) delete data.columns[i].orderable;
if (data.columns[i].data === data.columns[i].name) delete data.columns[i].name;
}
delete data.search.regex;}},"columns":[{"data":"action","name":"action","title":"Action","orderable":false,"searchable":false,"width":60,"className":"text-center"},{"data":"id","name":"id","title":"Id","orderable":true,"searchable":true},{"data":"address","name":"address","title":"Address","orderable":true,"searchable":true},{"data":"created_at","name":"created_at","title":"Created At","orderable":true,"searchable":true},{"data":"updated_at","name":"updated_at","title":"Updated At","orderable":true,"searchable":true}],"dom":"Bfrtip","order":[[1,"desc"]],"buttons":[{"extend":"create"},{"extend":"export"},{"extend":"print"},{"extend":"reset"},{"extend":"reload"}]});})(window,jQuery);
</script>
рдЕрдЧрд░ рдореИрдВ dd ($ dataTable-> ajax ()) рдбрд╛рд▓реВрдВ; рд╡рд╛рдкрд╕реА рд╕реЗ рдкрд╣рд▓реЗ рдирд┐рдпрдВрддреНрд░рдХ рдореЗрдВ, рдлрд┐рд░ рдкреВрд░реЗ рдбреЗрдЯрд╛ рдХреЗ рд╕рд╛рде Illuminate \ HttpJsonResponse рд╣реИред
рд╕рдмрд╕реЗ рдкрд╣рд▓реЗ рдореЗрд░реА рдЕрдВрдЧреНрд░реЗрдЬреА рдХреЗ рд▓рд┐рдП рдЦреЗрдж рд╣реИ
рдореЗрд░реЗ рдкрд╛рд╕ рдПрдХ рд╣реА рд╕рдорд╕реНрдпрд╛ рд╣реИ, рдФрд░ рдореЗрд░реЗ рд▓рд┐рдП рд╕рдорд╛рдзрд╛рди рдЦреЛрдЬреЗрдВ
рдЕрдЧрд░ рдореИрдВ рдЙрдкрдпреЛрдЧ рдХрд░рддрд╛ рд╣реВрдБ
@ рд╕реНрдиреЗрд╣ ('рд╕рд╛рдордЧреНрд░реА')
{{$ dataTable-> рдЯреЗрдмрд▓ ()}}
@ рд╕реНрдиреЗрд╣
@ рдкрд╢ ('рд╕реНрдХреНрд░рд┐рдкреНрдЯ')
{{$ dataTable-> рд╕реНрдХреНрд░рд┐рдкреНрдЯ ()}}
@ рдкрдВрдбреБрд╖
рдпрд╣ рдХрд╛рдо рдирд╣реАрдВ рдХрд░ рд░рд╣рд╛ рд╣реИред рдХреЛрдИ рдЖрдХрдбрд╝рд╛ рдЙрдкрд▓рдмреНрдз рдирд╣реАрдВ рд╣реИ/
рд▓реЗрдХрд┐рди рдЬрдм рдореИрдВ @push рдФрд░ @ рд╕реНрдХреНрд░рд┐рдкреНрдЯ рдХрд╛ рдЙрдкрдпреЛрдЧ рдирд╣реАрдВ рдХрд░рддрд╛ рддреЛ рдпрд╣ рдареАрдХ рд╣реИред рдЗрд╕ рдХрджрд░
@ рд╕реНрдиреЗрд╣ ('рд╕рд╛рдордЧреНрд░реА')
{{$ dataTable-> рдЯреЗрдмрд▓ ()}}
{{$ dataTable-> рд╕реНрдХреНрд░рд┐рдкреНрдЯ ()}}
@ рд╕реНрдиреЗрд╣
рдореБрдЭреЗ рдирд╣реАрдВ рдкрддрд╛ рдХрд┐ рдпрд╣ рд╕рд╣реА рд╣реИ, рд▓реЗрдХрд┐рди рдпрд╣ рдХрд╛рдо рд╣реИред
Bottstrap.js рдореЗрдВ рдореИрдВ рдЗрд╕ рддрд░рд╣ рдХреЛрдб рдкреЗрд╕реНрдЯ рдХрд░рддрд╛ рд╣реВрдВ
`рдХреЛрд╢рд┐рд╢ {
window.Popper = рдЖрд╡рд╢реНрдпрдХрддрд╛ ('popper.js')ред рдбрд┐рдлрд╝реЙрд▓реНрдЯ;
windowред $ = window.jQuery = рдЖрд╡рд╢реНрдпрдХрддрд╛ ('jquery');
require('bootstrap');
require('datatables.net-bs4');
require('datatables.net-buttons-bs4');
} catch (e) {} `
app.blade.php рдореЗрдВ
<script src="{{ asset('js/app.js') }}"></script>
<script src="{{ asset('vendor/datatables/buttons.server-side.js') }}"></script>
рдФрд░ рдпрд╣ рдареАрдХ рд╣реИ
рдФрд░ рдореИрдВрдиреЗ рднреА рджреЗрдЦрд╛, рдЬрдм рдореИрдВ рдЙрдкрдпреЛрдЧ рдХрд░рддрд╛ рд╣реВрдВ
it's default laravel setup, I get errors in console that jQuery and DataTables not defined
if I use or errors in console empty, but data don't showing, it's don't work
and if I delete defer, delete @push and delete @scripts it's begin work
@ 3s777 рдЯрд┐рдк рдХреЗ рд▓рд┐рдП рдзрдиреНрдпрд╡рд╛рдж! рд╡рд░реНрдХрдЕрд░рд╛рдЙрдВрдб рд╡рд╛рд╕реНрддрд╡ рдореЗрдВ рдорджрдж рдХреА:
@section('content')
{{ $dataTable->table() }}
{{ $dataTable->scripts() }}
<strong i="7">@endsection</strong>
рдирдорд╕реНрддреЗ,
рдореИрдВ adminlte рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░ рд░рд╣рд╛ рд╣реВрдБ рдФрд░ рдореЗрд░рд╛ рд╕рдорд╛рдзрд╛рди рд╣реИ
рдХреЗ рдмрдЬрд╛рдп
@Push ('рд╕реНрдХреНрд░рд┐рдкреНрдЯ')
{{$ dataTable-> рд╕реНрдХреНрд░рд┐рдкреНрдЯ ()}}
@ рдкрдВрдбреБрд╖
рдкреНрд░рдпреЛрдЧ рдХрд░реЗрдВ
@Push ('js')
{{$ dataTable-> рд╕реНрдХреНрд░рд┐рдкреНрдЯ ()}}
@ рдкрдВрдбреБрд╖
рдореИрдВ https://getstisla.com/getting-started рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рддрд╛ рд╣реВрдВ рдФрд░ рдореБрдЭреЗ рднреА рдпрд╣реА рд╕рдорд╕реНрдпрд╛ рд╣реИред
рдореБрдЭреЗ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдпрд╣ рдпрд╛рдЬрд░рд╛ рдкреИрдХреЗрдЬ рдпрд╛ рдбрд┐рдЯреИрдЯреЗрдмрд▓ рдкрд░ рдЯреЗрдВрдкрд▓реЗрдЯрд┐рдВрдЧ рдХреЗ рд╕рд╛рде рдПрдХ рд╕рдорд╕реНрдпрд╛ рд╣реИ рдХреНрдпреЛрдВрдХрд┐ рдХрдВрд╕реЛрд▓ рддреНрд░реБрдЯрд┐рдпреЛрдВ рдХреЛ рдкреНрд░рджрд░реНрд╢рд┐рдд рдирд╣реАрдВ рдХрд░ рд░рд╣рд╛ рд╣реИред
рдореЗрд░рд╛ рднреА рдпрд╣реА рдореБрджреНрджрд╛ рдерд╛ред рдореИрдВрдиреЗ рдЗрд╕реЗ рдЕрдкрдиреЗ рд▓реЗрдЖрдЙрдЯ (app.blade) рдореЗрдВ @Stack ('рд╕реНрдХреНрд░рд┐рдкреНрдЯ') рдЬреЛрдбрд╝рдХрд░ рд╣рд▓ рдХрд┐рдпрд╛ред рдЗрд╕ рддрд░рд╣
<script src="{{ asset('js/app.js') }}"></script>
@stack('scripts')
рдпрд╣ рдЕрднреА рднреА рдореЗрд░реЗ рд╕рд╛рде рдХрд╛рдо рдирд╣реАрдВ рдХрд░ рд░рд╣рд╛ рд╣реИ, рдореИрдВрдиреЗ рдКрдкрд░ рд╣рд░ рдХрд╛рдо рдХрд┐рдпрд╛ рд╣реИ рдФрд░ рдЕрднреА рднреА рдХреЛрдИ рдбреЗрдЯрд╛ рдирд╣реАрдВ рджрд┐рдЦрд╛ рд░рд╣рд╛ рд╣реИ, рдХреЛрдИ рднреА рдореЗрд░реА рдорджрдж рдХрд░ рд░рд╣рд╛ рд╣реИ
рдореИрдВрдиреЗ рдЗрд╕реЗ рдХрд╛рдо рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдХреНрдпрд╛ рдХрд┐рдпрд╛ (рд▓рд╛рд░рд╡реЗрд▓ 7):
resources/js/bootstrap.js
рд╕рдВрдкрд╛рджрд┐рдд рдХрд░реЗрдВ рдФрд░ рдирд┐рдореНрдирд▓рд┐рдЦрд┐рдд рдЬреЛрдбрд╝реЗрдВ:
require('bootstrap');
require('datatables.net-bs4');
require('datatables.net-buttons-bs4');
resources/scss/app.scss
рд╕рдВрдкрд╛рджрд┐рдд рдХрд░реЗрдВ рдФрд░ рдирд┐рдореНрдирд▓рд┐рдЦрд┐рдд рдЬреЛрдбрд╝реЗрдВ:
// DataTables
<strong i="12">@import</strong> "~datatables.net-bs4/css/dataTables.bootstrap4.css";
<strong i="13">@import</strong> "~datatables.net-buttons-bs4/css/buttons.bootstrap4.css";
рдлрд┐рд░ рдЙрдкрдпреЛрдЧ рдХрд░реЗрдВ
<script src="{{ mix('js/app.js') }}"></script>
// instead of
<script src="{{ asset('js/app.js') }}"></script>
<script src="{{ asset('vendor/datatables/buttons.server-side.js') }}"></script>
рд╕реНрдХреНрд░рд┐рдкреНрдЯ рдХреЛ рдиреАрдЪреЗ рддрдХ рд▓реЗ рдЬрд╛рдПрдВ
@stack('scripts')
</body>
</html>
рдЕрднреА рднреА рдореБрдЭ рдкрд░ рдХрд╛рдо рдирд╣реАрдВ рдХрд░ рд░рд╣рд╛ рд╣реИ
рдПрдХ рдЯрд╛рдЗрдкреЛ рдХреЗ рдХрд╛рд░рдг I FEDED рд╕реНрдХреНрд░рд┐рдкреНрдЯ рд▓реЛрдб рдирд╣реАрдВ рд╣реЛ рд░рд╣реА рд╣реИрдВ
рдореБрджреНрджрд╛ рдбрд┐рдлрд╝реЙрд▓реНрдЯ рд▓реЗрдЖрдЙрдЯ рдлрд╝рд╛рдЗрд▓ рдХреЗ рдирд┐рдЪрд▓реЗ рднрд╛рдЧ рдореЗрдВ @yield('footer_scripts')
рд▓реЗрдХрд┐рди table.blade рдлрд╝рд╛рдЗрд▓ рдореЗрдВ @section('footerscripts')
рдЖрд╢рд╛ рд╣реИ рдХрд┐ рдХреБрдЫ рдФрд░ рд╡рд┐рд╡рд░рдгреЛрдВ рдореЗрдВ рдмреЗрд╣рддрд░ рд╡реНрдпрд╛рдЦреНрдпрд╛ рдХрд░реЗрдВрдЧреЗред
рд╕рдмрд╕реЗ рдЙрдкрдпреЛрдЧреА рдЯрд┐рдкреНрдкрдгреА
рд╕рдмрд╕реЗ рдкрд╣рд▓реЗ рдореЗрд░реА рдЕрдВрдЧреНрд░реЗрдЬреА рдХреЗ рд▓рд┐рдП рдЦреЗрдж рд╣реИ
рдореЗрд░реЗ рдкрд╛рд╕ рдПрдХ рд╣реА рд╕рдорд╕реНрдпрд╛ рд╣реИ, рдФрд░ рдореЗрд░реЗ рд▓рд┐рдП рд╕рдорд╛рдзрд╛рди рдЦреЛрдЬреЗрдВ
рдЕрдЧрд░ рдореИрдВ рдЙрдкрдпреЛрдЧ рдХрд░рддрд╛ рд╣реВрдБ
@ рд╕реНрдиреЗрд╣ ('рд╕рд╛рдордЧреНрд░реА')
{{$ dataTable-> рдЯреЗрдмрд▓ ()}}
@ рд╕реНрдиреЗрд╣
@ рдкрд╢ ('рд╕реНрдХреНрд░рд┐рдкреНрдЯ')
{{$ dataTable-> рд╕реНрдХреНрд░рд┐рдкреНрдЯ ()}}
@ рдкрдВрдбреБрд╖
рдпрд╣ рдХрд╛рдо рдирд╣реАрдВ рдХрд░ рд░рд╣рд╛ рд╣реИред рдХреЛрдИ рдЖрдХрдбрд╝рд╛ рдЙрдкрд▓рдмреНрдз рдирд╣реАрдВ рд╣реИ/
рд▓реЗрдХрд┐рди рдЬрдм рдореИрдВ @push рдФрд░ @ рд╕реНрдХреНрд░рд┐рдкреНрдЯ рдХрд╛ рдЙрдкрдпреЛрдЧ рдирд╣реАрдВ рдХрд░рддрд╛ рддреЛ рдпрд╣ рдареАрдХ рд╣реИред рдЗрд╕ рдХрджрд░
@ рд╕реНрдиреЗрд╣ ('рд╕рд╛рдордЧреНрд░реА')
{{$ dataTable-> рдЯреЗрдмрд▓ ()}}
{{$ dataTable-> рд╕реНрдХреНрд░рд┐рдкреНрдЯ ()}}
@ рд╕реНрдиреЗрд╣
рдореБрдЭреЗ рдирд╣реАрдВ рдкрддрд╛ рдХрд┐ рдпрд╣ рд╕рд╣реА рд╣реИ, рд▓реЗрдХрд┐рди рдпрд╣ рдХрд╛рдо рд╣реИред
Bottstrap.js рдореЗрдВ рдореИрдВ рдЗрд╕ рддрд░рд╣ рдХреЛрдб рдкреЗрд╕реНрдЯ рдХрд░рддрд╛ рд╣реВрдВ
`рдХреЛрд╢рд┐рд╢ {
window.Popper = рдЖрд╡рд╢реНрдпрдХрддрд╛ ('popper.js')ред рдбрд┐рдлрд╝реЙрд▓реНрдЯ;
windowред $ = window.jQuery = рдЖрд╡рд╢реНрдпрдХрддрд╛ ('jquery');
} catch (e) {} `
app.blade.php рдореЗрдВ
рдФрд░ рдпрд╣ рдареАрдХ рд╣реИ