laravel 数据表似乎未加载-找不到错误

5lwkijsr  于 2022-11-18  发布在  其他
关注(0)|答案(1)|浏览(99)

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.

xzlaal3s

xzlaal3s1#

表中缺少<th></th>
编辑:正如你所看到的,我有1个<td>多和1个<th>是失踪。

相关问题