Here is my Console Error Log:
DevTools failed to load source map: Could not load content for chrome-extension://hnfanknocfeofbddgcijnmhnfnkdnaad/content.js.map: System error: net::ERR_BLOCKED_BY_CLIENT
DevTools failed to load source map: Could not load content for http://127.0.0.1:8000/customer/requestProvider.js.map: HTTP error: status code 404, net::ERR_HTTP_RESPONSE_CODE_FAILURE
form-advanced.init.js:1 Uncaught TypeError: a(...).spectrum is not a function
at e.init (form-advanced.init.js:1:1913)
at form-advanced.init.js:1:5231
at form-advanced.init.js:1:5238
e.init @ form-advanced.init.js:1
(anonymous) @ form-advanced.init.js:1
(anonymous) @ form-advanced.init.js:1
apexcharts.min.js:14 Uncaught (in promise) Error: Element not found
at apexcharts.min.js:14:38320
at new Promise (<anonymous>)
at t.value (apexcharts.min.js:14:37567)
at dashboard.init.js:1:708
(anonymous) @ apexcharts.min.js:14
value @ apexcharts.min.js:14
(anonymous) @ dashboard.init.js:1
apexcharts.min.js:14 Uncaught (in promise) Error: Element not found
at apexcharts.min.js:14:38320
at new Promise (<anonymous>)
at t.value (apexcharts.min.js:14:37567)
at dashboard.init.js:1:1418
(anonymous) @ apexcharts.min.js:14
value @ apexcharts.min.js:14
(anonymous) @ dashboard.init.js:1
apexcharts.min.js:14 Uncaught (in promise) Error: Element not found
at apexcharts.min.js:14:38320
at new Promise (<anonymous>)
at t.value (apexcharts.min.js:14:37567)
at dashboard.init.js:1:1922
(anonymous) @ apexcharts.min.js:14
value @ apexcharts.min.js:14
(anonymous) @ dashboard.init.js:1
jquery.min.js:2 jQuery.Deferred exception: Cannot read properties of undefined (reading 'mData') TypeError: Cannot read properties of undefined (reading 'mData')
at HTMLTableCellElement.<anonymous> (http://127.0.0.1:8000/backend/assets/libs/datatables.net/js/jquery.dataTables.min.js:91:247)
at Function.each (http://127.0.0.1:8000/backend/assets/libs/jquery/jquery.min.js:2:3003)
at S.fn.init.each (http://127.0.0.1:8000/backend/assets/libs/jquery/jquery.min.js:2:1481)
at HTMLTableElement.<anonymous> (http://127.0.0.1:8000/backend/assets/libs/datatables.net/js/jquery.dataTables.min.js:91:202)
at Function.each (http://127.0.0.1:8000/backend/assets/libs/jquery/jquery.min.js:2:3003)
at S.fn.init.each (http://127.0.0.1:8000/backend/assets/libs/jquery/jquery.min.js:2:1481)
at S.fn.init.l [as dataTable] (http://127.0.0.1:8000/backend/assets/libs/datatables.net/js/jquery.dataTables.min.js:84:148)
at h.fn.DataTable (http://127.0.0.1:8000/backend/assets/libs/datatables.net/js/jquery.dataTables.min.js:168:310)
at HTMLDocument.<anonymous> (http://127.0.0.1:8000/backend/assets/js/pages/datatables.init.js:1:46)
at e (http://127.0.0.1:8000/backend/assets/libs/jquery/jquery.min.js:2:30038) undefined
S.Deferred.exceptionHook @ jquery.min.js:2
t @ jquery.min.js:2
setTimeout (async)
(anonymous) @ jquery.min.js:2
c @ jquery.min.js:2
fireWith @ jquery.min.js:2
fire @ jquery.min.js:2
c @ jquery.min.js:2
fireWith @ jquery.min.js:2
ready @ jquery.min.js:2
B @ jquery.min.js:2
DevTools failed to load source map: Could not load content for http://127.0.0.1:8000/backend/assets/libs/bootstrap/js/bootstrap.bundle.min.js.map: HTTP error: status code 404, net::ERR_HTTP_RESPONSE_CODE_FAILURE
jquery.min.js:2 Uncaught TypeError: Cannot read properties of undefined (reading 'mData')
at HTMLTableCellElement.<anonymous> (jquery.dataTables.min.js:91:247)
at Function.each (jquery.min.js:2:3003)
at S.fn.init.each (jquery.min.js:2:1481)
at HTMLTableElement.<anonymous> (jquery.dataTables.min.js:91:202)
at Function.each (jquery.min.js:2:3003)
at S.fn.init.each (jquery.min.js:2:1481)
at S.fn.init.l [as dataTable] (jquery.dataTables.min.js:84:148)
at h.fn.DataTable (jquery.dataTables.min.js:168:310)
at HTMLDocument.<anonymous> (datatables.init.js:1:46)
at e (jquery.min.js:2:30038)
(anonymous) @ jquery.dataTables.min.js:91
each @ jquery.min.js:2
each @ jquery.min.js:2
(anonymous) @ jquery.dataTables.min.js:91
each @ jquery.min.js:2
each @ jquery.min.js:2
l @ jquery.dataTables.min.js:84
h.fn.DataTable @ jquery.dataTables.min.js:168
(anonymous) @ datatables.init.js:1
e @ jquery.min.js:2
t @ jquery.min.js:2
setTimeout (async)
S.readyException @ jquery.min.js:2
(anonymous) @ jquery.min.js:2
e @ jquery.min.js:2
t @ jquery.min.js:2
setTimeout (async)
(anonymous) @ jquery.min.js:2
c @ jquery.min.js:2
fireWith @ jquery.min.js:2
fire @ jquery.min.js:2
c @ jquery.min.js:2
fireWith @ jquery.min.js:2
t @ jquery.min.js:2
setTimeout (async)
(anonymous) @ jquery.min.js:2
c @ jquery.min.js:2
fireWith @ jquery.min.js:2
fire @ jquery.min.js:2
c @ jquery.min.js:2
fireWith @ jquery.min.js:2
ready @ jquery.min.js:2
B @ jquery.min.js:2
DevTools failed to load source map: Could not load content for http://127.0.0.1:8000/backend/assets/libs/metismenu/metisMenu.min.js.map: HTTP error: status code 404, net::ERR_HTTP_RESPONSE_CODE_FAILURE
DevTools failed to load source map: Could not load content for http://127.0.0.1:8000/backend/assets/libs/node-waves/waves.min.js.map: HTTP error: status code 404, net::ERR_HTTP_RESPONSE_CODE_FAILURE
Here is my admin_master.blade.php File:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Dashboard | Easy Inventory Shop </title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta content="Premium Multipurpose Admin & Dashboard Template" name="description" />
<meta content="Themesdesign" name="author" />
<!-- App favicon -->
<link rel="shortcut icon" href="{{ asset('backend/assets/images/favicon.ico') }}">
<!-- Select 2 -->
<link href="{{ asset('backend/assets/libs/select2/css/select2.min.css') }}" rel="stylesheet" type="text/css">
<!-- end Select 2 -->
<script src="https://code.jquery.com/jquery-3.6.1.min.js"></script>
<!-- jquery.vectormap css -->
<link href="{{ asset('backend/assets/libs/admin-resources/jquery.vectormap/jquery-jvectormap-1.2.2.css') }}" rel="stylesheet" type="text/css" />
<!-- DataTables -->
<link href="{{ asset('backend/assets/libs/datatables.net-bs4/css/dataTables.bootstrap4.min.css') }}" rel="stylesheet" type="text/css" />
<!-- Responsive datatable examples -->
<link href="{{ asset('backend/assets/libs/datatables.net-responsive-bs4/css/responsive.bootstrap4.min.css') }}" rel="stylesheet" type="text/css" />
<!-- Bootstrap Css -->
<link href="{{ asset('backend/assets/css/bootstrap.min.css') }}" id="bootstrap-style" rel="stylesheet" type="text/css" />
<!-- Icons Css -->
<link href="{{ asset('backend/assets/css/icons.min.css') }}" rel="stylesheet" type="text/css" />
<!-- App Css-->
<link href="{{ asset('backend/assets/css/app.min.css') }}" id="app-style" rel="stylesheet" type="text/css" />
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.css" >
</head>
<body data-topbar="dark">
<!-- <body data-layout="horizontal" data-topbar="dark"> -->
<!-- Begin page -->
<div id="layout-wrapper">
@include('admin.body.header')
<!-- ========== Left Sidebar Start ========== -->
@include('admin.body.sidebar')
<!-- Left Sidebar End -->
<!-- ============================================================== -->
<!-- Start right Content here -->
<!-- ============================================================== -->
<div class="main-content">
@yield('admin')
<!-- End Page-content -->
@include('admin.body.footer')
</div>
<!-- end main content-->
</div>
<!-- END layout-wrapper -->
<!-- Right Sidebar -->
<!-- /Right-bar -->
<!-- Right bar overlay-->
<div class="rightbar-overlay"></div>
<!-- JAVASCRIPT -->
<script src="{{ asset('backend/assets/libs/jquery/jquery.min.js') }}"></script>
<script src="{{ asset('backend/assets/libs/bootstrap/js/bootstrap.bundle.min.js') }}"></script>
<script src="{{ asset('backend/assets/libs/metismenu/metisMenu.min.js') }}"></script>
<script src="{{ asset('backend/assets/libs/simplebar/simplebar.min.js') }}"></script>
<script src="{{ asset('backend/assets/libs/node-waves/waves.min.js') }}"></script>
<!-- apexcharts -->
<script src="{{ asset('backend/assets/libs/apexcharts/apexcharts.min.js') }}"></script>
<!-- jquery.vectormap map -->
<script src="{{ asset('backend/assets/libs/admin-resources/jquery.vectormap/jquery-jvectormap-1.2.2.min.js') }}"></script>
<script src="{{ asset('backend/assets/libs/admin-resources/jquery.vectormap/maps/jquery-jvectormap-us-merc-en.js') }}"></script>
<!-- Required datatable js -->
<script src="{{ asset('backend/assets/libs/datatables.net/js/jquery.dataTables.min.js') }}"></script>
<script src="{{ asset('backend/assets/libs/datatables.net-bs4/js/dataTables.bootstrap4.min.js') }}"></script>
<!-- Responsive examples -->
<script src="{{ asset('backend/assets/libs/datatables.net-responsive/js/dataTables.responsive.min.js') }}"></script>
<script src="{{ asset('backend/assets/libs/datatables.net-responsive-bs4/js/responsive.bootstrap4.min.js') }}"></script>
<script src="{{ asset('backend/assets/js/pages/dashboard.init.js') }}"></script>
<!-- App js -->
<script src="{{ asset('backend/assets/js/app.js') }}"></script>
<script>
@if(Session::has('message'))
var type = "{{ Session::get('alert-type','info') }}"
switch(type){
case 'info':
toastr.info(" {{ Session::get('message') }} ");
break;
case 'success':
toastr.success(" {{ Session::get('message') }} ");
break;
case 'warning':
toastr.warning(" {{ Session::get('message') }} ");
break;
case 'error':
toastr.error(" {{ Session::get('message') }} ");
break;
}
@endif
</script>
<!-- Required datatable js -->
<script src="{{ asset('backend/assets/libs/datatables.net/js/jquery.dataTables.min.js') }}"></script>
<script src="{{ asset('backend/assets/libs/datatables.net-bs4/js/dataTables.bootstrap4.min.js') }}"></script>
<!-- Datatable init js -->
<script src="{{ asset('backend/assets/js/pages/datatables.init.js') }}"></script>
<script src="{{ asset('backend/assets/js/validate.min.js') }}"></script>
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@10"></script>
<script src="{{ asset('backend/assets/js/code.js') }}"></script>
<script src="{{ asset('backend/assets/js/handlebars.js') }}"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/notify/0.4.2/notify.min.js" ></script>
<!-- For Select2 -->
<script src="{{ asset('backend/assets/libs/select2/js/select2.min.js') }}"></script>
<script src="{{ asset('backend/assets/js/pages/form-advanced.init.js') }}"></script>
<!-- end For Select2 -->
</body>
</html>
And here is the content of my public/backend/assets:
https://pastebin.com/PhRjFCwg
Also here is my Table:
<div class="row">
<div class="col-12">
<div class="card">
<div class="card-body">
<a href="{{ route('customer.add') }}" class="btn btn-dark btn-rounded waves-effect waves-light" style="float:right;"><i class="fas fa-plus-circle"> Add Customer </i></a> <br> <br>
<h4 class="card-title">Customer All Data </h4>
<table id="datatable" class="table table-bordered dt-responsive nowrap" style="border-collapse: collapse; border-spacing: 0; width: 100%;">
<thead>
<tr>
<th>Sl</th>
<th>Name</th>
<th>Geschlecht</th>
<th>Das ID </th>
<th>Cost Ctr</th>
<th>Subarea</th>
<th>Mobile Number</th>
<th>E-Mail</th>
<th>Status</th>
</thead>
<tbody>
@foreach($customers as $key => $item)
<tr>
<td> {{ $key+1}} </td>
<td> {{ $item->name }} </td>
<td>{{ $item->geschlecht}}</td>
<td> {{ $item->dasid }} </td>
<td> {{ $item->costctr }} </td>
<td> {{$item->subarea}}</td>
<td> {{ $item->mobile_no }} </td>
<td> {{ $item->email }} </td>
<td> {{ $item->status }} </td>
<td>
<a href="{{ route('customer.edit',$item->id) }}" class="btn btn-info sm" title="Edit Data"> <i class="fas fa-edit"></i> </a>
<a href="{{ route('customer.delete',$item->id) }}" class="btn btn-danger sm" title="Delete Data" id="delete"> <i class="fas fa-trash-alt"></i> </a>
</td>
</tr>
@endforeach
</tbody>
</table>
</div>
</div>
</div> <!-- end col -->
</div> <!-- end row -->
</div> <!-- container-fluid -->
</div>
I really don't know why it does not show datatables correctly. The Tables itself show but the sorting, "Show X Entries" and the "x Rows" in the Footer is not there. Everything that should be there for it to work is there. I just started with Laravel and it seems to be a bit too complex for me.
1条答案
按热度按时间xzlaal3s1#
表中缺少
<th></th>
。编辑:正如你所看到的,我有1个
<td>
多和1个<th>
是失踪。