Error for Kuda

Getting errors as show below jquery.dataTables.js:62 Uncaught ReferenceError: jQuery is not defined at jquery.dataTables.js:62:31 at jquery.dataTables.js:65:1 (anonymous) @ jquery.dataTables.js:62 (anonymous) @ jquery.dataTables.js:65 datatables.min.js:14 jQuery.Deferred exception: Cannot read properties of undefined (reading 'display') TypeError: Cannot read properties of undefined (reading 'display') at HTMLDocument.<anonymous> (http://127.0.0.1:8000/printers/:144:51) at e (https://cdn.datatables.net/v/dt/jq-3.7.0/jszip-3.10.1/dt-1.13.6/b-2.4.1/b-colvis-2.4.1/b-html5-2.4.1/b-print-2.4.1/datatables.min.js:14:26990) at t (https://cdn.datatables.net/v/dt/jq-3.7.0/jszip-3.10.1/dt-1.13.6/b-2.4.1/b-colvis-2.4.1/b-html5-2.4.1/b-print-2.4.1/datatables.min.js:14:27292) undefined ce.Deferred.exceptionHook @ datatables.min.js:14 t @ datatables.min.js:14 setTimeout (async) (anonymous) @ datatables.min.js:14 c @ datatables.min.js:14 fireWith @ datatables.min.js:14 fire @ datatables.min.js:14 c @ datatables.min.js:14 fireWith @ datatables.min.js:14 ready @ datatables.min.js:14 P @ datatables.min.js:14 datatables.min.js:14 Uncaught TypeError: Cannot read properties of undefined (reading 'display') at HTMLDocument.<anonymous> ((index):144:51) at e (datatables.min.js:14:26990) at t (datatables.min.js:14:27292) (anonymous) @ (index):144 e @ datatables.min.js:14 t @ datatables.min.js:14 setTimeout (async) ce.readyException @ datatables.min.js:14 (anonymous) @ datatables.min.js:14 e @ datatables.min.js:14 t @ datatables.min.js:14 setTimeout (async) (anonymous) @ datatables.min.js:14 c @ datatables.min.js:14 fireWith @ datatables.min.js:14 fire @ datatables.min.js:14 c @ datatables.min.js:14 fireWith @ datatables.min.js:14 t @ datatables.min.js:14 setTimeout (async) (anonymous) @ datatables.min.js:14 c @ datatables.min.js:14 fireWith @ datatables.min.js:14 fire @ datatables.min.js:14 c @ datatables.min.js:14 fireWith @ datatables.min.js:14 ready @ datatables.min.js:14 P @ datatables.min.js:14 127.0.0.1/:1 Uncaught (in promise) Error: A listener indicated an asynchronous response by returning true, but the message channel closed before a response was received

by Varger

HTML

<link href="https://cdn.datatables.net/v/dt/jq-3.7.0/jszip-3.10.1/dt-1.13.6/b-2.4.1/b-colvis-2.4.1/b-html5-2.4.1/b-print-2.4.1/datatables.min.css" rel="stylesheet">
  
<script src="https://cdn.datatables.net/1.13.6/js/jquery.dataTables.js"></script>
<link rel="stylesheet" href="https://cdn.datatables.net/1.13.6/css/jquery.dataTables.css" />
<link rel="stylesheet" href="https://cdn.datatables.net/buttons/2.4.1/js/dataTables.buttons.min.js"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.2.7/pdfmake.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.2.7/vfs_fonts.js"></script>
<script src="https://cdn.datatables.net/v/dt/jq-3.7.0/jszip-3.10.1/dt-1.13.6/b-2.4.1/b-colvis-2.4.1/b-html5-2.4.1/b-print-2.4.1/datatables.min.js"></script>

<br>
<br>
<table class="table display" id="printers">

    <thead>
        <tr>
            <th>Serial Number</th>
            <th>Item Name</th>
            <th>Printer Type</th>
            <th>Asset Office </th>
            <th>Zesa Number</th>
            <th>Date of Purchase </th>
        </tr>
    </thead>
    
</table>

JavaScript

<script>
    $(document).ready(function() {
    var table = $('#printers').DataTable( {
        dom: 'Bfrtip',
        buttons: ['csv', 'excel', 'pdf', 'print','add'],
        ajax: {
            "processing":true,
            "serverside": true,
            url: '/printerapi/?format=json',
            "dataSrc":"",
            },
            responsive: {
                details: {
                    display: DataTable.Responsive.display.modal({
                        header: function (row) {
                            var data = row.data();
                            return 'Details for ' + data[0] + 'Printer';
                        }
                    }),
                    renderer: DataTable.Responsive.renderer.tableAll({
                        tableClass: 'table'
                    })
                }
            },
            columns: [
                {data:"serial_number"},
                {data:"item_name"},
                {data:"printer_type"},
                {data:"asset_office"},
                {data:"zesa_number"},
                {data:"dateof_purchase"}
                ]
            
    });
});
</script>