jQuery.Deferred exception: $(...).DataTable is not a function TypeError: $(...).DataTable ...
jQuery.Deferred exception: $(...).DataTable is not a function TypeError: $(...).DataTable ...
LeFlow
Posts: 5Questions: 2Answers: 0
Hi.
I have the error message in subject of the post.
But I don't find the problem.
Show my code :
<!-- Appel du fichier de config de la connexion à la base de données -->
<!DOCTYPE html>
<html lang="fr" dir="ltr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>Titre</title>
<!-- CSS -->
<link rel="stylesheet" href="css\bootstrap.css">
<link rel="stylesheet" href="css\bootstrap-reboot.css">
<link rel="stylesheet" type="text/css" href="css\mdb.css">
<link rel="stylesheet" href="css\style.css">
<link rel="icon" type="image/png" href="images\favicon.png">
<!-- JS -->
<script type="text/javascript" src="js\jquery.js" charset="utf-8"></script>
<script type="text/javascript" src="js\bootstrap.js" charset="utf-8"></script>
<script type="text/javascript" src="js\mdb.js" charset="utf-8" defer></script>
<script type="text/javascript" src="js\script.js" charset="utf-8" defer></script>
</head>
<body>
<div class="container-fluid">
<div class="row head">
<div class="col" id="logo">
<img src="images\home.jpg" alt="Logo">
</div>
<div class="col">
<span id="title">TOOLS</span>
</div>
<div class="col" id="imap">
<img src="images\imap.jpg" alt="">
</div>
</div> <!-- head -->
<div id="menu">
<nav class="nav nav-tabs">
<a class="nav-item nav-link active" href="#home" data-toggle="tab">Home</a>
<a class="nav-item nav-link" href="#p1" data-toggle="tab">tools</a>
<a class="nav-item nav-link" href="#p2" data-toggle="tab">terminés</a>
<a class="nav-item nav-link" href="#p3" data-toggle="tab">en_cours</a>
<a class="nav-item nav-link" href="#p4" data-toggle="tab">Backlog</a>
</nav>
<div class="tab-content">
<div class="tab-pane active" id="home">
<div class="tab-pane active row" id="home">
<div id="carouselExampleIndicators" class="carousel slide col-9" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="2"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="3"></li>
</ol>
<div class="carousel-inner">
<div class="carousel-item active">
<img class="d-block w-90 img-fluid" src="images\slide\1.jpg" alt="First slide">
</div>
<div class="carousel-item">
<img class="d-block w-90 img-fluid img-fluid" src="images\slide\2.jpg" alt="Second slide">
</div>
<div class="carousel-item">
<img class="d-block w-90 img-fluid" src="images\slide\3.jpg" alt="Third slide">
</div>
<div class="carousel-item">
<img class="d-block w-90 img-fluid" src="images\slide\4.jpg" alt="Fouth slide">
</div>
</div>
<a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
<div class="col-3" id="last">
<div id="last_changes">
<a id="fleche_haut"><img src="images\fleche_haut.gif"/></a>
<div id="contenu_changes_ext">
<div id="contenu_changes_int">
</div>
</div>
<a id="fleche_bas"><img src="images\fleche_bas.gif"/></a>
</div>
</div>
</div>
</div>
<div class="tab-pane" id="p1">Home</div>
<div class="tab-pane" id="p2">Outils_terminés</div>
<div class="tab-pane" id="p3">Outils_en_cours</div>
<div class="tab-pane" id="p4">Backlog</div>
</div> <!-- menu -->
<div class="row" id="footer">
<div class="col-3" id="footer_left">
<p id="intranet_access">
<a href="http://servintranet/" target="blank">
<img src="images\pucebleue.png" >
</a>
<span> Access to central intranet</span>
</p>
</div>
<div class="col-9" id="footer_right">
<p><strong> For any need of tool development, please send an e-mail with a short description of your need</strong></p>
<p>e-mail : <a href="mailto:tools@contact.com">tools@contact.com</a></p>
</div>
</div>
<div class="clear"></div>
<div class="terms col-12">
<a href="#">Terms of use.</a>
</div>
</div> <!-- container -->
</body>
</html>
Thx for your help.
This discussion has been closed.
Answers
I don't see any reference to datatables in the code you posted. What does
script.jscontain?Kevin
Very fast answer ^^
My script.js contain only
EDIT : DataTables is mdb
https://mdbootstrap.com/docs/jquery/tables/datatables/
It doesn't look like you are loading any of the datatables JS and CSS include files. The Installation docs explain what you need.
Kevin
TY.
My pbl was the we need write theader <thead> and <tbody> balises on php file.
Thx for your help