First I get Typescript error because Jquery is not included in page.. Once I include Jquery(I thought this theme came DataTable ready?.. ) I get this error,
Uncaught TypeError: $(...).DataTable is not a function
at HTMLDocument.<anonymous> (customers:2297:165)
at j (jquery.js:3148:30)
at Object.fireWith [as resolveWith] (jquery.js:3260:7)
at Function.ready (jquery.js:3472:13)
at HTMLDocument.J (jquery.js:3503:10)..
Why is my Datatable not working?
It oads the column but after it gets to scripting everything shuts down..
Hi Kenneth,
Please check the console log if there is an error. If the "processing" indicator is stuck in the middle of the table, seems like there is an error on the server-side.
Please check the Network tab as well. The server-side might have an error. Working request should be like this;
<img src="https://i.ibb.co/wLFSPt8/image.png" alt="image" border="0">
Thanks
I need to know where can I insert the CSS that came with metronic for DataTables because it is not applying Metronics css
In config/global/pages.php
add -
"page here" => [
"*" => [
"title" => "page title here",
"assets" => [
"custom" => [
"css" => [
"plugins/custom/datatables/datatables.bundle.css",
],
"js" => [
"plugins/custom/datatables/datatables.bundle.js",
],
],
],
],
],
Thank you! Everything is good now! Except now i get this Button saying processing in the middle of the table.. Any idea why? Its that it doesnt let the button create appear.. do i need another step?
Also if you're having trouble I always reference the Metronic Laravel Documentation.
https://preview.keenthemes.com/metronic8/laravel/documentation/configuration/page?demo=demo1
You can add this three lines into <head> Tag
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.12.0/css/jquery.dataTables.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.12.0/js/jquery.dataTables.js"></script>
Next, you can write script tage after the </table> tag
<script>
$(document).ready(function()
{
$('#test').DataTable();
});
</script>