Ho una pagina HTML con un template di fondo e un div in cui inserisco una datatable. Il problema è che i 2 elementi non coesistono correttamente a causa di conflitti tra le librerie.
Per il momento ho risolto utilizzando il tag object all'interno del div in modo da caricare la datatable da un link esterno. Tuttavia mi sembra una soluzione poco valida (seppur funzionante).
C'è modo di far valere le librerie solo su un div in modo tale da evitare conflitti?
Grazie
sposto in js
nel frattempo prova a dare qualche dettaglio in più
In pratica utilizzo nella pagina HTML un template scaricato che utilizza le seguenti librerie:
Nella parte centrale della pagina ho un div che contiene una datatable, che per funzionare ha bisogno di queste librerie:codice:<link href='https://fonts.googleapis.com/css?family=Open+Sans:300,400,700' rel='stylesheet' type='text/css'> <link rel="stylesheet" href="templategestione/css/reset.css"> <!-- CSS reset --> <link rel="stylesheet" href="templategestione/css/style.css"> <!-- Resource style --> <script src="templategestione/js/modernizr.js"></script> <!-- Modernizr --> <script src="templategestione/js/jquery-2.1.4.js"></script> <script src="templategestione/js/jquery.menu-aim.js"></script> <script src="templategestione/js/main.js"></script>
Se nella pagina metto solo il template o solo la datatable funziona tutto correttamente, se li metto insieme nascono i problemi perché a quanto ho capito le librerie jquery vanno in contrasto.codice:<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.15/css/jquery.dataTables.min.css"> <link rel="stylesheet" href="http://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> <script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js"></script> <script type="text/javascript" language="javascript" src="https://cdn.datatables.net/1.10.15/js/jquery.dataTables.min.js"></script>
Ultima modifica di Andrea_CT; 24-01-2019 a 14:54
Richiami due volte jquery con versioni diverse e quindi ti da un errore.
Rimuovi la riga con jquery-1.12.4.js dal secondo snippet di codice e vedi se funziona.
no niente da fare... non carica la datatableOriginariamente inviata da M4V1
Che errore ti da in console?
nessun errore, però ho notato che se provo a scorrere la pagina sballa tutto e compare la tabella tremolante in secondo piano
Per la libreria più vecchia (quella del datatables) usa il noConflict
Cavicchi Andrea
Problemi con javascript, jquery, ajax clicca qui
Niente da fare, posto il codice completo:
codice:<?php include "configurazione.php"; session_start(); if($_SESSION["livello"] != 2) { die("Permesso negato"); } ?> <!doctype html> <html> <head> <title> <?php echo $_SESSION["username"]; ?> </title> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link href='https://fonts.googleapis.com/css?family=Open+Sans:300,400,700' rel='stylesheet' type='text/css'> <link rel="stylesheet" href="templategestione/css/reset.css"> <!-- CSS reset --> <link rel="stylesheet" href="templategestione/css/style.css"> <!-- Resource style --> <script src="templategestione/js/modernizr.js"></script> <!-- Modernizr --> <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.15/css/jquery.dataTables.min.css"> <link rel="stylesheet" href="http://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"> <script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.12.4.js"></script> <script type="text/javascript" language="javascript" src="https://cdn.datatables.net/1.10.15/js/jquery.dataTables.min.js"></script> </head> <body> <header class="cd-main-header"> <a href="#0" class="cd-logo"><img src="templategestione/img/cd-logo.svg" alt="Logo"></a> <a href="#0" class="cd-nav-trigger">Menu<span></span></a> <nav class="cd-nav"> <ul class="cd-top-nav"> <li class="has-children account"> <a href="#0"> <?php echo $_SESSION["username"]; ?> </a> <ul> <li><a href="#0">Modifica account</a></li> <li><a href="logout.php">Logout</a></li> </ul> </li> </ul> </nav> </header> <main class="cd-main-content"> <nav class="cd-side-nav"> <ul> <li class="overview active"> <a href="#">I miei tornei</a> </li> </ul> <ul> <li class="comments"> <a href="creazione_torneo.php">Creazione torneo</a> </li> </ul> <ul> <li class="comments"> <a href="iscrizione_torneo.php">Iscrizione torneo</a> </li> </ul> <ul> <li class="action-btn"><a href="#0">+ Button</a></li> </ul> </nav> <div class="content-wrapper"> <table id="imieitornei" class="display" cellspacing="0" width="100%"> <thead> <tr> <th>Nome</th> <th></th> </tr> </thead> </table> </div> </main> <script src="templategestione/js/jquery-2.1.4.js"></script> <script src="templategestione/js/jquery.menu-aim.js"></script> <script src="templategestione/js/main.js"></script> </body> </html> <script> function vaialtorneo(nome_torneo) { //window.location="nometorneo.php"+nome_torneo; } $(document).ready( function() { $('#imieitornei').dataTable( { "sAjaxSource": "imieitornei.php", "bFilter": true, "dom": "Bfrtip", "responsive": true, "bDestroy": true, "aoColumns": [ { "mData": "NOME" }, { "mData": "button", "mRender": function(data, type, row) { return '<input onclick="vaialtorneo(\''+row.NOME+'\')" type="button" value="Entra"/>' } }, ], }); } ) </script>
Scusa ma non ho capito se hai provato il noConflict? Ricordati che per risolvere i problemi richiede una certa conoscenza di js e jquery, se manca questa caratteristica forse è meglio se posti nel forum che modero (leggendo attentamente il regolamento in evidenza).
Ciao.
Cavicchi Andrea
Problemi con javascript, jquery, ajax clicca qui
Permessi di invio
Rispondi quotando