- @php
+@php
// as it is possible that we can be redirected with persistent table we save the alerts in a variable
// and flush them from session, so we will get them later from localStorage.
$backpack_alerts = \Alert::getMessages();
\Alert::flush();
- @endphp
+@endphp
- {{-- DATA TABLES SCRIPT --}}
- <script src="https://unpkg.com/@popperjs/core@2"></script>
- <script src="https://unpkg.com/tippy.js@6"></script>
+{{-- DATA TABLES SCRIPT --}}
+<script src="https://unpkg.com/@popperjs/core@2"></script>
+<script src="https://unpkg.com/tippy.js@6"></script>
<script type="text/javascript" src="{{ asset('packages/datatables.net/js/jquery.dataTables.min.js') }}"></script>
<script type="text/javascript"
src="{{ asset('packages/datatables.net-bs4/js/dataTables.bootstrap4.min.js') }}"></script>
var $dtDefaultPageLength = {{ $crud->getDefaultPageLength() }};
let $dtStoredPageLength = localStorage.getItem('DataTables_crudTable_/{{$crud->getRoute()}}_pageLength');
- if(!$dtStoredPageLength && $dtCachedInfo.length !== 0 && $dtCachedInfo.length !== $dtDefaultPageLength) {
+ if (!$dtStoredPageLength && $dtCachedInfo.length !== 0 && $dtCachedInfo.length !== $dtDefaultPageLength) {
localStorage.removeItem('DataTables_crudTable_/{{$crud->getRoute()}}');
}
$newAlerts = @json($backpack_alerts);
- Object.entries($newAlerts).forEach(function(type) {
- if(typeof $oldAlerts[type[0]] !== 'undefined') {
- type[1].forEach(function(msg) {
+ Object.entries($newAlerts).forEach(function (type) {
+ if (typeof $oldAlerts[type[0]] !== 'undefined') {
+ type[1].forEach(function (msg) {
$oldAlerts[type[0]].push(msg);
});
} else {
@endif
if (saved_list_url && persistentUrl != window.location.href) {
- // finally redirect the user.
+ // finally redirect the user.
window.location.href = persistentUrl;
}
@endif
- window.crud = {
+ window.crud = {
exportButtons: JSON.parse('{!! json_encode($crud->get('list.export_buttons')) !!}'),
functionsToRunOnDataTablesDrawEvent: [],
addFunctionToDataTablesDrawEventQueue: function (functionName) {
var arr = str.split('.');
var fn = window[arr[0]];
- for (var i = 1; i < arr.length; i++)
- { fn = fn[ arr[i] ]; }
+ for (var i = 1; i < arr.length; i++) {
+ fn = fn[arr[i]];
+ }
fn.apply(window, args);
},
- updateUrl : function (url) {
- let urlStart = "{{ url($crud->route) }}";
- let urlEnd = url.replace(urlStart, '');
- urlEnd = urlEnd.replace('/search', '');
- let newUrl = urlStart + urlEnd;
- let tmpUrl = newUrl.split("?")[0],
- params_arr = [],
- queryString = (newUrl.indexOf("?") !== -1) ? newUrl.split("?")[1] : false;
-
- // exclude the persistent-table parameter from url
- if (queryString !== false) {
- params_arr = queryString.split("&");
- for (let i = params_arr.length - 1; i >= 0; i--) {
- let param = params_arr[i].split("=")[0];
- if (param === 'persistent-table') {
- params_arr.splice(i, 1);
+ updateUrl: function (url) {
+ let urlStart = "{{ url($crud->route) }}";
+ let urlEnd = url.replace(urlStart, '');
+ urlEnd = urlEnd.replace('/search', '');
+ let newUrl = urlStart + urlEnd;
+ let tmpUrl = newUrl.split("?")[0],
+ params_arr = [],
+ queryString = (newUrl.indexOf("?") !== -1) ? newUrl.split("?")[1] : false;
+
+ // exclude the persistent-table parameter from url
+ if (queryString !== false) {
+ params_arr = queryString.split("&");
+ for (let i = params_arr.length - 1; i >= 0; i--) {
+ let param = params_arr[i].split("=")[0];
+ if (param === 'persistent-table') {
+ params_arr.splice(i, 1);
+ }
}
+ newUrl = params_arr.length ? tmpUrl + "?" + params_arr.join("&") : tmpUrl;
}
- newUrl = params_arr.length ? tmpUrl + "?" + params_arr.join("&") : tmpUrl;
- }
- window.history.pushState({}, '', newUrl);
- localStorage.setItem('{{ Str::slug($crud->getRoute()) }}_list_url', newUrl);
+ window.history.pushState({}, '', newUrl);
+ localStorage.setItem('{{ Str::slug($crud->getRoute()) }}_list_url', newUrl);
},
dataTableConfiguration: {
- bInfo: {{ var_export($crud->getOperationSetting('showEntryCount') ?? true) }},
+ bInfo: {{ var_export($crud->getOperationSetting('showEntryCount') ?? true) }},
@if ($crud->getResponsiveTable())
responsive: {
details: {
},
}
},
- fixedHeader: true,
+ fixedHeader: true,
@else
responsive: false,
scrollX: true,
@endif
@endif
autoWidth: false,
- pageLength: $dtDefaultPageLength,
+ pageLength: $dtDefaultPageLength,
lengthMenu: @json($crud->getPageLengthMenu()),
/* Disable initial sort */
aaSorting: [],
"thousands": "{{ trans('backpack::crud.thousands') }}",
"lengthMenu": "{{ trans('backpack::crud.lengthMenu') }}",
"loadingRecords": "{{ trans('backpack::crud.loadingRecords') }}",
- "processing": "<img src='{{ asset('packages/backpack/base/img/spinner.svg') }}' alt='{{ trans('backpack::crud.processing') }}'>",
+ "processing": "<img src='{{ asset('packages/backpack/base/img/spinner.svg') }}' alt='{{ trans('backpack::crud.processing') }}'>",
"search": "_INPUT_",
"searchPlaceholder": "{{ trans('backpack::crud.search') }}...",
"zeroRecords": "{{ trans('backpack::crud.zeroRecords') }}",
},
processing: true,
serverSide: true,
- @if($crud->getOperationSetting('showEntryCount') === false)
+ @if($crud->getOperationSetting('showEntryCount') === false)
pagingType: "simple",
- @endif
+ @endif
searching: @json($crud->getOperationSetting('searchableTable') ?? true),
ajax: {
- "url": "{!! url($crud->route.'/search').'?'.Request::getQueryString() !!}",
- "type": "POST",
- "data": {
- "totalEntryCount": "{{$crud->getOperationSetting('totalEntryCount') ?? false}}"
- },
+ "url": "{!! url($crud->route.'/search').'?'.Request::getQueryString() !!}",
+ "type": "POST",
+ "data": {
+ "totalEntryCount": "{{$crud->getOperationSetting('totalEntryCount') ?? false}}"
+ },
},
dom:
"<'row hidden'<'col-sm-6'i><'col-sm-6 d-print-none'f>>" +
<script type="text/javascript">
jQuery(document).ready(function ($) {
- window.crud.table = $("#crudTable").DataTable(window.crud.dataTableConfiguration);
+ window.crud.table = $("#crudTable").DataTable(window.crud.dataTableConfiguration);
- window.crud.updateUrl(location.href);
+ window.crud.updateUrl(location.href);
// move search bar
$("#crudTable_filter").appendTo($('#datatable_search_stack'));
$("#crudTable_filter input").removeClass('form-control-sm');
// move "showing x out of y" info to header
- @if($crud->getSubheading())
- $('#crudTable_info').hide();
- @else
+ @if($crud->getSubheading())
+ $('#crudTable_info').hide();
+ @else
$("#datatable_info_stack").html($('#crudTable_info')).css('display', 'inline-flex').addClass('animated fadeIn');
- @endif
+ @endif
@if($crud->getOperationSetting('resetButton') ?? true)
// create the reset button
// when changing page length in datatables, save it into localStorage
// so in next requests we know if the length changed by user
// or by developer in the controller.
- $('#crudTable').on( 'length.dt', function ( e, settings, len ) {
+ $('#crudTable').on('length.dt', function (e, settings, len) {
localStorage.setItem('DataTables_crudTable_/{{$crud->getRoute()}}_pageLength', len);
});
});
- $('#crudTable').on( 'page.dt', function () {
+ $('#crudTable').on('page.dt', function () {
localStorage.setItem('page_changed', true);
});
crud.functionsToRunOnDataTablesDrawEvent.forEach(function (functionName) {
crud.executeFunctionByName(functionName);
});
- @if($crud->getOperationSetting('lineButtonsAsDropdown'))
- // Get action column
- const actionColumnIndex = $('#crudTable').find('th[data-action-column=true]').index();
- if (actionColumnIndex !== -1) {
- $('#crudTable tr').each(function (i, tr) {
- const actionCell = $(tr).find('td').eq(actionColumnIndex);
- const actionButtons = $(actionCell).find('a.btn.btn-link');
- // Wrap the cell with the component needed for the dropdown
- actionCell.wrapInner('<div class="nav-item dropdown"></div>');
- actionCell.wrapInner('<div class="dropdown-menu dropdown-menu-left"></div>');
- // Prepare buttons as dropdown items
- actionButtons.map((index, action) => {
- $(action).addClass('dropdown-item').removeClass('btn btn-sm btn-link');
- $(action).find('i').addClass('me-2 text-primary');
- });
- actionCell.prepend('<a class="btn btn-sm px-2 py-1 btn-outline-primary dropdown-toggle actions-buttons-column" href="#" data-toggle="dropdown" data-bs-toggle="dropdown" data-bs-auto-close="outside" aria-expanded="false">{{ trans('backpack::crud.actions') }}</a>');
- });
- }
- @endif
+ @if($crud->getOperationSetting('lineButtonsAsDropdown'))
+ // Get action column
+ const actionColumnIndex = $('#crudTable').find('th[data-action-column=true]').index();
+ if (actionColumnIndex !== -1) {
+ $('#crudTable tr').each(function (i, tr) {
+ const actionCell = $(tr).find('td').eq(actionColumnIndex);
+ const actionButtons = $(actionCell).find('a.btn.btn-link');
+ // Wrap the cell with the component needed for the dropdown
+ actionCell.wrapInner('<div class="nav-item dropdown"></div>');
+ actionCell.wrapInner('<div class="dropdown-menu dropdown-menu-left"></div>');
+ // Prepare buttons as dropdown items
+ actionButtons.map((index, action) => {
+ $(action).addClass('dropdown-item').removeClass('btn btn-sm btn-link');
+ $(action).find('i').addClass('me-2 text-primary');
+ });
+ actionCell.prepend('<a class="btn btn-sm px-2 py-1 btn-outline-primary dropdown-toggle actions-buttons-column" href="#" data-toggle="dropdown" data-bs-toggle="dropdown" data-bs-auto-close="outside" aria-expanded="false">{{ trans('backpack::crud.actions') }}</a>');
+ });
+ }
+ @endif
}).dataTable();
// when datatables-colvis (column visibility) is toggled
// when columns are hidden by reponsive plugin,
// the table should have the has-hidden-columns class
crud.table.on('responsive-resize', function (e, datatable, columns) {
- if (crud.table.responsive.hasHidden()) {
- $("#crudTable").removeClass('has-hidden-columns').addClass('has-hidden-columns');
- } else {
- $("#crudTable").removeClass('has-hidden-columns');
+ let hideColumns = crud.table.responsive.hasHidden();
+ if (!hideColumns) {
+ $("#crudTable").removeClass('has-hidden-columns');
+ hideColumns = $("#crudTable").outerWidth() > $("#crudTable_wrapper").outerWidth() + 30;
+ }
+
+ if (hideColumns) {
+ $("#crudTable").addClass('has-hidden-columns');
}
});
@else