I just started using datatables and the instructions to initialize the table seems easy enough.
I am able to get the table to appear and all of the data is inside, however both the pagination and search function doesn't work.
Please help.
This is my code:
<?php
Include 'DBFunctions.php';
?>
<html>
<head>
<!-- DataTables CSS -->
<link rel="stylesheet" type="text/css" href="DataTables-1.10.9/media/css/jquery.dataTables.css">
<!-- DataTables -->
<script type="text/javascript" charset="utf8" src="DataTables-1.10.9/media/js/jquery.dataTables.js"></script>
</head>
<body>
<?php
$queryData = "select c.*, o.officer_name from coa c, officer o WHERE o.persnum = c.importing_officer ORDER BY date_imported DESC";
$resultData = mysqli_query($link, $queryData) or die(mysqli_error($link));
?>
<h1>View All COAs</h1><br>
<table id="myTable" class="display">
<thead>
<tr>
<th>PO Number: </th>
<th>Chemical Name: </th>
<th>COA Date: </th>
<th>Quantity: </th>
<th>Plant Name: </th>
<th>Parameter Results: </th>
<th>Importing Officer: </th>
<th>COA Attempt: </th>
<th>Date Imported: </th>
<th>Pass/Fail: </th>
</tr>
</thead>
<?php
while ($row = mysqli_fetch_array($resultData)) {
?>
<tbody>
<tr>
<td><?php echo $row['po_number']?></td>
<td><?php echo $row['chemical_name']?></td>
<td><?php echo $row['date_coa']?></td>
<td><?php echo $row['quantity']?></td>
<td><?php echo $row['plant_name']?></td>
<td><?php echo $row['parameters_results']?></td>
<td><?php echo $row['officer_name']?></td>
<td><?php echo $row['coa_attempt']?></td>
<td><?php echo $row['date_imported']?></td>
<td><?php echo $row['pass_or_fail']?></td>
</tr>
</tbody>
<?php } ?>
</table>
<script>
$(document).ready( function () {
$('#myTable').DataTable({
});
} );
</script>
</body>
</html>
Take <tbody> out of the while loop so it looks like:
<tbody>
<?php
while ($row = mysqli_fetch_array($resultData)) {
?>
<tr>
<td><?php echo $row['po_number']?></td>
<td><?php echo $row['chemical_name']?></td>
<td><?php echo $row['date_coa']?></td>
<td><?php echo $row['quantity']?></td>
<td><?php echo $row['plant_name']?></td>
<td><?php echo $row['parameters_results']?></td>
<td><?php echo $row['officer_name']?></td>
<td><?php echo $row['coa_attempt']?></td>
<td><?php echo $row['date_imported']?></td>
<td><?php echo $row['pass_or_fail']?></td>
</tr>
<?php } ?>
</tbody>
You will have to enable the various options that datatable provide, for search and pagination you need to do this.
You should check the documentation for other available options
$(document).ready( function () {
$('#myTable').DataTable({
"paging": true,
"searching": true,
});
} );
Related
I am trying to fetch data from an sql database into a php table. Yet the problem is that the first data from my database doesn't appear into the table. Did i commit a mistake ? The following is my code....
<?php
include "koneksi.php";
$sql = mysqli_query ($link,
"SELECT * FROM absen");
$data = mysqli_fetch_array($sql);
?>
<html>
<head>
<title>Data Mahasiswa</title>
</head>
<body>
<p><h2><b><center>DATA MAHASISWA</center></b></h2></p>
<table border="2" style="1000px;" align="center">
<tr bgcolor="blue">
<th>No</th>
<th>Nama</th>
<th>NIM</th>
<th>Jenis Kelamin</th>
</tr>
<?php
while($data)
while($data = mysqli_fetch_array($sql)){
?>
<tr>
<td><?php echo $data['no']; ?></td>
<td><?php echo $data['nama']; ?></</td>
<td><?php echo $data['nim']; ?></</td>
<td><?php echo $data['jenis_kelamin']; ?></</td>
</tr>
<?php } ?>
</table>
<center><b><h3><a href="Website.html"><img src="Capture.jpg" width="100px">
</a></h3></b></center>
</p>
</body>
</html>
You are doing mysqli_fetch_array() twice. Fixed code:
<?php
include "koneksi.php";
$sql = mysqli_query ($link,
"SELECT * FROM absen");
?>
<html>
<head>
<title>Data Mahasiswa</title>
</head>
<body>
<p><h2><b><center>DATA MAHASISWA</center></b></h2></p>
<table border="2" style="1000px;" align="center">
<tr bgcolor="blue">
<th>No</th>
<th>Nama</th>
<th>NIM</th>
<th>Jenis Kelamin</th>
</tr>
<?php
while($data = mysqli_fetch_array($sql)){
?>
<tr>
<td><?php echo $data['no']; ?></td>
<td><?php echo $data['nama']; ?></</td>
<td><?php echo $data['nim']; ?></</td>
<td><?php echo $data['jenis_kelamin']; ?></</td>
</tr>
<?php } ?>
</table>
<center><b><h3><a href="Website.html"><img src="Capture.jpg" width="100px">
</a></h3></b></center>
</p>
</body>
</html>
I am trying to display JSON content in a PHP table but its not working. I can't figure out what I should change.
Here is my code:
<html>
<head>
<title>Download</title>
</head>
<body>
<?php
$myData = file_get_contents("https://youtubetoany.com/#api/json/videostreams/VEou0QBeHlk");
$myObject = json_decode($myData);
$myObjectMap = $myObject->vidInfo;
?>
<table>
<thead>
<tr>
<td>Url</td>
<td>Size</td>
<td>Quality</td>
<td>Type</td>
</tr>
</thead>
<tbody>
<?php foreach($myObjectMap as $key => $item): ?>
<tr>
<td><?PHP echo $item->dloadUrl; ?></td>
<td><?PHP echo $item->rSize; ?></td>
<td><?PHP echo $item->round; ?></td>
<td><?PHP echo $item->quality; ?></td>
<td><?PHP echo $item->ftype; ?></td>
</tr>
<?php endforeach; ?>
</tbody>
</table>
</body>
</html>
This is what I get in my browser:
Url Size Quality Type
Your source has some javascript attached. You need to get rid of that:
$myData = file_get_contents("https://youtubetoany.com/#api/json/videostreams/VEou0QBeHlk");
// get the substring from start til the first occurence of "<script"
$myRealData = substr($myData,0,strpos($myData,"<script"));
$myObject = json_decode($myRealData);
BUT this source doesn't seem to be made to be grabbed. So I won't rely on that source or that it'll stay the way you find it now.
I just found probably why its not working. The link returns a JavaScript attached to the bottom of the JSON. So here is my solution.
<html>
<head>
<title>Download</title>
</head>
<body>
<?php
$myData = file_get_contents("https://youtubetoany.com/#api/json/videostreams/VEou0QBeHlk");
// This up to the last occurrence of the "}"
$json_block = substr($myData, 0, strripos($myData, "}"));
$myObject = json_decode($json_block);
$myObjectMap = $myObject->vidInfo;
?>
<table>
<thead>
<tr>
<td>Url</td>
<td>Size</td>
<td>Quality</td>
<td>Type</td>
</tr>
</thead>
<tbody>
<?php foreach($myObjectMap as $key => $item): ?>
<tr>
<td><?PHP echo $item->dloadUrl; ?></td>
<td><?PHP echo $item->rSize; ?></td>
<td><?PHP echo $item->round; ?></td>
<td><?PHP echo $item->quality; ?></td>
<td><?PHP echo $item->ftype; ?></td>
</tr>
<?php endforeach; ?>
</tbody>
</table>
</body>
</html>
im having table reading values from database using PDO and display it in table,Then finally i used Datatable javascript code.Now my table having pagination,searching option.
But now i want to include one more column as 'Action' to do edit, delete fucntion.When i include these fifth column as Action. Then my table appears as normal..not as datatable format (pagination,searching option is not there). My coding below:
<?php
include("config.php");
include("header.php");
try {
$sql = "SELECT * FROM auditplan";
$stmt = $DB->prepare($sql);
$stmt->execute();
$result = $stmt->fetchAll();
} catch (Exception $ex) {
echo $ex->getMessage();
}
?>
<link rel="stylesheet" href="<?=BASE_URL?>/bootstrap/css/bootstrap.css">
<link rel="stylesheet" href="<?=BASE_URL?>/bootstrap/css/bootstrap.min.css">
<script type="text/javascript" src="<?=BASE_URL?>js/jquery2.0.2.min.js"></script>
<script type="text/javascript" src="<?=BASE_URL?>js/jquery.dataTables.js"></script>
<script type="text/javascript" src="<?=BASE_URL?>js/jquery.dataTables.min.js"></script>
<link href="<?=BASE_URL?>themecss/datatables/dataTables.bootstrap.css" rel="stylesheet">
<script src="<?=BASE_URL?>themejs/plugins/datatables/dataTables.bootstrap.js"></script>
<script src="<?=BASE_URL?>themejs/jquery-ui-1.10.3.js"></script>
<script src="<?=BASE_URL?>themejs/jquery-ui-1.10.3.min.js"></script>
<div class="col-sm-9 col-md-10 main">
<h1 class="page-header"> Audit Plan </h1>
<a href="Auditplanentry.php" class="btn btn-primary" >Add New</a>
<table class="table table-striped" id="auditplantbl">
<thead>
<tr>
<th>Audit ID</th>
<th>Year</th>
<th>Month</th>
<th>Status</th>
<th>Comments</th>
<th>Action</th>
</tr>
</thead>
<tbody>
<?php
foreach($result as $row){ ?>
<tr>
<td><?php echo $row['auditid']?></td>
<td><?php echo $row['year'] ?></td>
<td><?php echo $row['month'] ?></td>
<td><?php echo $row['status']?></td>
<td><?php echo $row['comment']?></td>
</tr>
<?php }
?>
</tbody>
</table>
</div>
<script type="text/javascript">
$(document).ready(function () {
$('#auditplantbl').dataTable({
"bLengthChange": false,
});
});
</script>
You have 6 columns in your table header but only 5 in your body, you need to match the same number of columns in your header and body for datatable to work fine.
You need to add one in the body to add the buttons or whatever you were planning to do to delete or edit your items :
<?php
foreach($result as $row){ ?>
<tr>
<td><?php echo $row['auditid']?></td>
<td><?php echo $row['year'] ?></td>
<td><?php echo $row['month'] ?></td>
<td><?php echo $row['status']?></td>
<td><?php echo $row['comment']?></td>
<td> edit link / delete link </td>
</tr>
<?php }
I have two tables in single page with same class and the data for generated tables are server side processed.
Take a look at the below code.
PHP code
<table class="table table-striped display" id="somedetailList" >
<thead>
<tr>
<th>some Name</th>
<th>some Adress</th>
<th>some Mobile</th>
<th>some Name</th>
<th>some da</th>
<th>some as</th>
<th>some ds</th>
</tr>
</thead>
<tbody>
<?php foreach ($ros as $row) { ?>
<tr>
<td><?php echo $row->partyname; ?></td>
<td><?php echo $row->address; ?></td>
<td><?php echo $row->phonenumber; ?></td>
<td><?php echo $row->name ?></td>
<td><?php echo $row->total; ?></td>
<td><?php echo $row->advance; ?></td>
<td><?php echo $row->balance; ?></td>
</tr>
<?php } ?>
</tbody>
</table>
<table class="table table-striped display" id="vehicledetailList" >
<thead>
<tr>
<th>Party Name</th>
<th>Party Adress</th>
<th>Party Mobile</th>
<th>Driver Name</th>
<th>Total</th>
<th>Advance</th>
<th>Balance</th>
</tr>
</thead>
<tbody>
<?php foreach ($balan as $bal) { ?>
<tr>
<td><?php echo $bal->partyname; ?></td>
<td><?php echo $bal->address; ?></td>
<td><?php echo $bal->phonenumber; ?></td>
<td><?php echo $bal->name ?></td>
<td><?php echo $bal->total; ?></td>
<td><?php echo $bal->advance; ?></td>
<td><?php echo $bal->balance; ?></td>
</tr>
<?php } ?>
</tbody>
</table>
And Script for tables is below
<link rel="stylesheet" type="text/css" href="//cdn.datatables.net/1.10.4/css/jquery.dataTables.min.css">
<script type="text/javascript" charset="utf8" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.2.min.js"></script>
<script type="text/javascript" charset="utf8" src="//cdn.datatables.net/1.10.4/js/jquery.dataTables.min.js"></script>
<script>
jQuery(document).ready(function(){
jQuery('table.display').DataTable();
});
</script>
http://jsfiddle.net/qdRDw/
Even i tried exactly as this fiddle, then too iam getting the same issue, i'm getting multiple pagination box for each tables.
Please help.
Modified the sDOM variable in this updated JSFiddle: http://jsfiddle.net/qdRDw/64/
Is this what you wanted?
I'm asking a user to fill out a form and I want to display that information in table format. Then, I want the user to be able to sort the table from the header row on each column. I am trying to use the jquery tablesorter plug in but cannot seem to get it to work. Does the plug in not work with PHP generated tables?
<!DOCTYPE HTML>
<html>
<head>
<title>Dashboard</title>
<link href ="table.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="jquery-latest.js"></script>
<script type="text/javascript" src="jquery.tablesorter.js"></script>
<script type = "text/javascript">
$(document).ready(function() {
$("#sortedtable").tablesorter();
});
</script>
</head>
<body>
<?php
unset($_SESSION['errors_record']);
define("WEB_DB", "server_db");
define("DB_USER", "root");
define("DB_PASS", "prog");
$db_host = "localhost";
MYSQL_CONNECT($db_host,DB_USER,DB_PASS);
mysql_select_db(WEB_DB);
?>
<p><h1>SRG TDE Technical Review Dashboard</h1></p>
<p>
<button>Create a New Review Record</button>
Logout
</p>
<div class="CSSTableGenerator">
<table id = "sortedtable" class = "tablesorter">
<thead>
<tr>
<th>Review Record ID</th>
<th>Project</th>
<th>Date</th>
<th>Author</th>
<th>Moderator</th>
<th>Portfolio Lead</th>
<th>Review Artifact Type</th>
<th>Review Artifact Name</th>
<th>Version</th>
</tr>
$sql = "select record_id,project,date,author,moderator,portlead,rtype,rname,version from dashboard_table ORDER BY date DESC";
$result = mysql_query($sql);
$num = mysql_num_rows($result);
if ($num)
{
while(list($record_id,$project,$date,$author,$moderator,$portlead,$rtype,$rname,$version) = mysql_fetch_row($result))
{
?>
<?php $url="http://localhost/main_tab.php?record=" . $record_id ?>
<tbody>
<tr>
<td><?php echo "<a href = '$url'>$record_id</a>";?></td>
<td><?php echo $project?></td>
<td><?php echo $date?></td>
<td><?php echo $author?></td>
<td><?php echo $moderator?></td>
<td><?php echo $portlead?></td>
<td><?php echo $rtype?></td>
<td><?php echo $rname?></td>
<td><?php echo $version?></td>
</tr>
<?php
}
}
?>
</tbody>
</table>
</div>
</body>
</html>
I'm not that good with php, but it appears that the table being built will have every row wrapped in a new tbody. Move the initial <tbody> outside of the while loop:
if ($num)
{
echo "<tbody>";
while(list($record_id,$project,$date,$author,$moderator,$portlead,$rtype,$rname,$version) = mysql_fetch_row($result))
{
?>
<?php $url="http://localhost/main_tab.php?record=" . $record_id ?>
<tr>
<td><?php echo "<a href = '$url'>$record_id</a>";?></td>
<td><?php echo $project?></td>
<td><?php echo $date?></td>
<td><?php echo $author?></td>
<td><?php echo $moderator?></td>
<td><?php echo $portlead?></td>
<td><?php echo $rtype?></td>
<td><?php echo $rname?></td>
<td><?php echo $version?></td>
</tr>
<?php
}
}
?>
</tbody>