Postingan lainnya
Buku Ini Koding!
Baru!
Buku ini akan jadi teman perjalanan kamu belajar sampai dapat kerjaan di dunia programming!
Kelas Premium!
Belajar bikin website dari nol sekarang
Gunakan kupon "lebihcepat" untuk diskon 25%!
Datatables console error jQuery.Deferred exception: Cannot set property '_DT_CellIndex'
datatables kok gak work ya, dapet console error
jQuery.Deferred exception: Cannot set property '_DT_CellIndex'
ini isi codingannya
<?php
include("config.php");
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- bootstrap css -->
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/style.css">
<!-- icons -->
<link rel="apple-touch-icon" sizes="180x180" href="icons/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="icons/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="icons/favicon-16x16.png">
<link rel="manifest" href="icons/site.webmanifest">
<link rel="mask-icon" href="icons/safari-pinned-tab.svg" color="#5bbad5">
<meta name="msapplication-TileColor" content="#da532c">
<meta name="theme-color" content="#ffffff">
<script src="https://code.jquery.com/jquery-3.1.0.js"></script>
<script src="//cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js"></script>
<title>INKA</title>
</head>
<body >
<!-- php func -->
<?php
session_start();
if($_SESSION['id']=='$id'){
header("location:index.php?pesan=gagal");
}
?>
<!-- -->
<!-- jumbo tron -->
<div class="jumbotron jumbotron-fluid ">
<!-- container -->
<div class="container mt-n4" style="height:500px">
<!-- flexbox -->
<div class=" d-flex flex-row-reverse mb-3 ml-5">
<a href="logout.php" type="button" class="btn btn-danger mb-5" id="keluar" name="keluar ">keluar</a>
</div>
<!--flexbox end -->
<!-- card -->
<div class="card text-nowrap">
<div class="card-header text-center strong">
<!-- tampil nama -->
<?php
$query = "SELECT * FROM user
where id= $_SESSION[id]";
$query = "SELECT id,nama
FROM user
where user.id= $_SESSION[id]";
$result = mysqli_query($koneksi, $query);
if(!$result){
die ("Query Error: ".mysqli_errno($koneksi).
" - ".mysqli_error($koneksi));
}
while($data = mysqli_fetch_assoc($result))
{
echo "<h3 class='text-uppercase'>HASIL KINERJA </br> <p class='font-weight-bold text-danger'> $data[nama] </p> </h3>";
}
?>
<!-- tampil nama end -->
</div>
<div class="card-body">
<!-- <form class="form-inline my-2 my-lg-0 pt-2 pb-2">
<input class="form-control mr-sm-2" type="search" placeholder="Filter tanggal" aria-label="Search" id="myInput" onkeyup="myFunction()" >
</form> -->
<!-- table -->
<div >
<div class="table-responsive table-fixed table-wrapper">
<table class="table table-bordered table-striped table-fixed text-center" id="myTable">
<thead>
<tr>
<th scope="col">No</th>
<th scope="col">ID</th>
<th scope="col">Nama</th>
<th scope="col">Golongan</th>
<th scope="col">Nilai Output</th>
<th scope="col">Penilaian Atasan</th>
<th scope="col">Nilai Learning</th>
<th scope="col">Nilai Kedisiplinan</th>
<th scope="col">Nilai 5R</th>
<th scope="col">Hasil</th>
<th scope="col">Tanggal</th>
</tr>
</thead>
<!-- query -->
<?php
$no = 0;
$query = "SELECT * FROM user
where id= $_SESSION[id]";
$query = "SELECT user.id,user.nama,golongan,nilai_output,nilai_atasan,nilai_learning,nilai_kedisiplinan,nilai_5r,overall,tanggal
FROM tkaryawan
JOIN user
ON user.id=tkaryawan.id
where user.id= $_SESSION[id]
ORDER BY tanggal DESC";
$result = mysqli_query($koneksi, $query);
if(!$result){
die ("Query Error: ".mysqli_errno($koneksi).
" - ".mysqli_error($koneksi));
}
while($data = mysqli_fetch_assoc($result))
{
$no++;
?>
<tbody>
<tr>
<th scope="row"><?php echo $no; ?></th>
<td><?php echo $data['id'];?></td>
<td class="text-capitalize"><?php echo $data['nama'];?></td>
<td><?php echo $data['golongan'];?></td>
<td><?php echo $data['nilai_output'];?></td>
<td><?php echo $data['nilai_atasan'];?></td>
<td><?php echo $data['nilai_learning'];?></td>
<td><?php echo $data['nilai_kedisiplinan'];?></td>
<td><?php echo $data['nilai_5r'];?></td>
<td class="font-weight-bold text-danger"><?php echo $data['overall'];?></td>
<td class="text-secondary"><?php echo $data['tanggal'];?></td>
<tr>
<tbody>
<?php
}
mysqli_free_result($result);
mysqli_close($koneksi);
?>
</table>
</div>
<!-- table end -->
</div>
</div>
<!-- card end -->
</div>
<!-- container end -->
</div>
<!-- jumbotron end -->
<!-- script -->
<script src="js/custom.js"></script>
<script src="js/bootstrap.min.js"></script>
<script>
$(document).ready(function(){
$('#myTable').DataTable();
});
</script>
</body>
</html>
1 Jawaban:
<div>Hallo, izin menjawab, sepertinya looping agan, membuat struktur tabelnya jadi tidak beraturan.<br>Untuk membuat tabel dengan terstruktur harusnya sepert ini :<br><br></div><pre><table border = "1" width = "100%"> <!-- Mendefinisikan header table --> <thead> <tr> <td colspan = "4">This is the head of the table</td> </tr> </thead>
&lt;!-- Mendefinisikan body table --&gt;
&lt;tbody&gt;
&lt;tr&gt;
&lt;td&gt;Cell 1&lt;/td&gt;
&lt;td&gt;Cell 2&lt;/td&gt;
&lt;td&gt;Cell 3&lt;/td&gt;
&lt;td&gt;Cell 4&lt;/td&gt;
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;!-- Mendefinisikan footer pada table --&gt;
&lt;tfoot&gt;
&lt;tr&gt;
&lt;td colspan = "4"&gt;This is the foot of the table&lt;/td&gt;
&lt;/tr&gt;
&lt;/tfoot&gt;
</table></pre><div><br>plugin Datatable, mengharuskan struktur tabel kita seperti diatas, sedangkan dari script agan, agan melakukan looping pada tag <tbody> sehingga tag tersebut akan berulang beberapa kali. Solusinya, lakukan looping (while) di dalam <tbody>, jadi yang di loop itu tag <tr> -nya, kodenya seperti ini :<br><br></div><pre><?php include("config.php"); ?>
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<em><!-- bootstrap css --></em> <link rel="stylesheet" href="css/bootstrap.min.css"> <link rel="stylesheet" href="css/style.css">
<em><!-- icons --></em> <link rel="apple-touch-icon" sizes="180x180" href="icons/apple-touch-icon.png"> <link rel="icon" type="image/png" sizes="32x32" href="icons/favicon-32x32.png"> <link rel="icon" type="image/png" sizes="16x16" href="icons/favicon-16x16.png"> <link rel="manifest" href="icons/site.webmanifest"> <link rel="mask-icon" href="icons/safari-pinned-tab.svg" color="#5bbad5"> <meta name="msapplication-TileColor" content="#da532c"> <meta name="theme-color" content="#ffffff"> <script src="https://code.jquery.com/jquery-3.1.0.js"></script> <script src="//cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js"></script>
<title>INKA</title> </head> <body > <em><!-- php func --></em> <?php session_start();
if($_SESSION['id']=='$id'){
header("location:index.php?pesan=gagal");
}
?&gt;
<em>&lt;!-- --&gt;</em>
<em>&lt;!-- jumbo tron --&gt;</em>
&lt;div class="jumbotron jumbotron-fluid "&gt;
<em>&lt;!-- container --&gt;</em>
&lt;div class="container mt-n4" style="height:500px"&gt;
<em>&lt;!-- flexbox --&gt;</em>
&lt;div class=" d-flex flex-row-reverse mb-3 ml-5"&gt;
&lt;a href="logout.php" type="button" class="btn btn-danger mb-5" id="keluar" name="keluar "&gt;keluar&lt;/a&gt;
&lt;/div&gt;
<em>&lt;!--flexbox end --&gt;</em>
<em>&lt;!-- card --&gt;</em>
&lt;div class="card text-nowrap"&gt;
&lt;div class="card-header text-center strong"&gt;
<em>&lt;!-- tampil nama --&gt;</em>
&lt;?php
$query = "SELECT * FROM user
where id= $_SESSION[id]";
$query = "SELECT id,nama
FROM user
where user.id= $_SESSION[id]";
$result = mysqli_query($koneksi, $query);
if(!$result){
die ("Query Error: ".mysqli_errno($koneksi).
" - ".mysqli_error($koneksi));
}
while($data = mysqli_fetch_assoc($result))
{
echo "&lt;h3 class='text-uppercase'&gt;HASIL KINERJA &lt;/br&gt; &lt;p class='font-weight-bold text-danger'&gt; $data[nama] &lt;/p&gt; &lt;/h3&gt;";
}
?&gt;
<em>&lt;!-- tampil nama end --&gt;</em>
&lt;/div&gt;
&lt;div class="card-body"&gt;
<em>&lt;!-- &lt;form class="form-inline my-2 my-lg-0 pt-2 pb-2"&gt;</em>
<em> <input class="form-control mr-sm-2" type="search" placeholder="Filter tanggal" aria-label="Search" id="myInput" onkeyup="myFunction()" ></em> <em> </form> --></em> <em><!-- table --></em> <div > <div class="table-responsive table-fixed table-wrapper"> <table class="table table-bordered table-striped table-fixed text-center" id="myTable"> <thead> <tr> <th scope="col">No</th> <th scope="col">ID</th> <th scope="col">Nama</th> <th scope="col">Golongan</th> <th scope="col">Nilai Output</th> <th scope="col">Penilaian Atasan</th> <th scope="col">Nilai Learning</th> <th scope="col">Nilai Kedisiplinan</th> <th scope="col">Nilai 5R</th> <th scope="col">Hasil</th> <th scope="col">Tanggal</th> </tr> </thead> <tbody> <em><!-- query --></em> <?php $no = 0; $query = "SELECT * FROM user where id= $_SESSION[id]";
$query = "SELECT user.id,user.nama,golongan,nilai_output,nilai_atasan,nilai_learning,nilai_kedisiplinan,nilai_5r,overall,tanggal
FROM tkaryawan
JOIN user
ON user.id=tkaryawan.id
where user.id= $_SESSION[id]
ORDER BY tanggal DESC";
$result = mysqli_query($koneksi, $query);
if(!$result){
die ("Query Error: ".mysqli_errno($koneksi).
" - ".mysqli_error($koneksi));
}
while($data = mysqli_fetch_assoc($result))
{
$no++;
?&gt;
&lt;tr&gt;
&lt;th scope="row"&gt;&lt;?php echo $no; ?&gt;&lt;/th&gt;
&lt;td&gt;&lt;?php echo $data['id'];?&gt;&lt;/td&gt;
&lt;td class="text-capitalize"&gt;&lt;?php echo $data['nama'];?&gt;&lt;/td&gt;
&lt;td&gt;&lt;?php echo $data['golongan'];?&gt;&lt;/td&gt;
&lt;td&gt;&lt;?php echo $data['nilai_output'];?&gt;&lt;/td&gt;
&lt;td&gt;&lt;?php echo $data['nilai_atasan'];?&gt;&lt;/td&gt;
&lt;td&gt;&lt;?php echo $data['nilai_learning'];?&gt;&lt;/td&gt;
&lt;td&gt;&lt;?php echo $data['nilai_kedisiplinan'];?&gt;&lt;/td&gt;
&lt;td&gt;&lt;?php echo $data['nilai_5r'];?&gt;&lt;/td&gt;
&lt;td class="font-weight-bold text-danger"&gt;&lt;?php echo $data['overall'];?&gt;&lt;/td&gt;
&lt;td class="text-secondary"&gt;&lt;?php echo $data['tanggal'];?&gt;&lt;/td&gt;
&lt;tr&gt;
&lt;?php
}
mysqli_free_result($result);
mysqli_close($koneksi);
?&gt;
&lt;tbody&gt;
&lt;/table&gt;
&lt;/div&gt;
<em>&lt;!-- table end --&gt;</em>
&lt;/div&gt;
&lt;/div&gt;
<em>&lt;!-- card end --&gt;</em>
&lt;/div&gt;
<em>&lt;!-- container end --&gt;</em>
&lt;/div&gt;
<em>&lt;!-- jumbotron end --&gt;</em>
<em><!-- script --></em> <script src="js/custom.js"></script> <script src="js/bootstrap.min.js"></script> <script> $(document).ready(function(){ $('#myTable').DataTable(); }); </script>
</body> </html></pre><div><br>Semoga membantu!</div>