Jquery (Datatables) features not fully initializing? php/mysql - php

I am attempting to apply Jquery's Datatables to display my database. In the example featured in this link, the table is searchable, can be ordered, and has nice color seperation.
http://www.datatables.net/examples/basic_init/zero_configuration.html
My current code displays the data, but with no sorting functionality, no search option, just the raw data, bold titles, and bars separating the rows (no alternating colors as in the example.) Pic with junk data:
It seems it is applying some of the css but not all? I'm lost on why the functionality and remaining style is missing. I went back and put in html structure from my last code with the same results and no errors thrown.
Code:
<?php
$servername = "localhost";
$username = "username";
$password = "password";
$dbname = "dbname";
// Create connection
$conn = new mysqli($servername, $username, $password, $dbname);
// Check connection
if ($conn->connect_error) {
die("Connection failed: " . $conn->connect_error);
}
$sql = "SELECT Sid, Fname, Lname, Email, Dtype, Mac, Date FROM StudentDeviceReg";
$result = $conn->query($sql);
?>
<!Doctype html>
<html>
<head>
<title>DataTables</title>
<Meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script src="media/js/jquery-1.11.1.min.js" type="text/javascript"></script>
<script src="media/js/jquery.dataTables.min.js" type="text/javascript"></script>
<style type="text/css">
#import "media/css/jquery.dataTables.css";
</style>
<script type="text/javascript" charset="utf-8">
$(document).ready(function(){
$('#datatables').dataTable();
})
</script>
</head>
<body>
<div>
<thead>
<?php
if ($result->num_rows > 0) {
echo "<table id='datatables' class='display'>
<tr>
<th>ID</th>
<th>First Name</th>
<th>Last Name</th>
<th>Email</th>
<th>Device</th>
<th>Mac Address</th>
<th>Date</th>
</tr>";
?>
</thead>
<tbody>
<?php
// output data of each row
while($row = $result->fetch_assoc()) {
echo "<tr>
<td>".$row["Sid"]."</td>
<td>".$row["Fname"]."</td>
<td>".$row["Lname"]."</td>
<td>".$row["Email"]."</td>
<td>".$row["Dtype"]."</td>
<td>".$row["Mac"]."</td>
<td>".$row["Date"]."</td>
</tr>";
}
echo "</table>";
} else {
echo "0 results";
}
$conn->close();
?>
</tbody>
</div>
</body>
</html>

Your table tree is not structured properly.
<body>
<div>
<?php
if ($result->num_rows > 0) {
echo "
<table id='datatables' class='display'>
<thead>
<tr>
<th>ID</th>
<th>First Name</th>
<th>Last Name</th>
<th>Email</th>
<th>Device</th>
<th>Mac Address</th>
<th>Date</th>
</tr>
</thead>
<tbody>";
while($row = $result->fetch_assoc()) {
echo "
<tr>
<td>".$row["Sid"]."</td>
<td>".$row["Fname"]."</td>
<td>".$row["Lname"]."</td>
<td>".$row["Email"]."</td>
<td>".$row["Dtype"]."</td>
<td>".$row["Mac"]."</td>
<td>".$row["Date"]."</td>
</tr>";
}
echo "
<tbody>
</table>";
}
?>
</div>
</body>

Related

Attach SQL to button

I want to get data from a MySQL Database;
EDIT:
I want to be able to modify a query in order to obtain different rows corresponding to a specific date, using a datapicker.
I need to generate a report (an Excel file) from a query, make it user-friendly, using HTML and PHP but I don't know how to do that.
EDIT: Sorry, I am going to edit this question:
<?php
$connect = mysqli_connect("localhost", "root", "", "testing");
$sql = "SELECT * FROM tbl_customer";
$result = mysqli_query($connect, $sql);
?>
<html>
<head>
<title>Attempt to get data</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
</head>
<body>
<div class="container">
<br />
<br />
<br />
<div class="table-responsive">
<h2 align="center">Export MySQL data to Excel in PHP</h2><br />
<table class="table table-bordered">
<tr>
<th>Name</th>
<th>Address</th>
<th>City</th>
<th>Postal Code</th>
<th>Country</th>
</tr>
<?php
while($row = mysqli_fetch_array($result))
{
echo '
<tr>
<td>'.$row["CustomerName"].'</td>
<td>'.$row["Address"].'</td>
<td>'.$row["City"].'</td>
<td>'.$row["PostalCode"].'</td>
<td>'.$row["Country"].'</td>
</tr>
';
}
?>
</table>
<br />
<form method="post" action="export.php">
<input type="submit" name="export" class="btn btn-success" value="Export" />
</form>
</div>
</div>
</body>
</html>
And
<?php
//export.php
$connect = mysqli_connect("localhost", "root", "", "testing");
$output = '';
if(isset($_POST["export"]))
{
$query = "SELECT * FROM tbl_customer";
$result = mysqli_query($connect, $query);
if(mysqli_num_rows($result) > 0)
{
$output .= '
<table class="table" bordered="1">
<tr>
<th>Name</th>
<th>Address</th>
<th>City</th>
<th>Postal Code</th>
<th>Country</th>
</tr>
';
while($row = mysqli_fetch_array($result))
{
$output .= '
<tr>
<td>'.$row["CustomerName"].'</td>
<td>'.$row["Address"].'</td>
<td>'.$row["City"].'</td>
<td>'.$row["PostalCode"].'</td>
<td>'.$row["Country"].'</td>
</tr>
';
}
$output .= '</table>';
header('Content-Type: application/xls');
header('Content-Disposition: attachment; filename=download.xls');
echo $output;
}
}
?>
Take a look at this:
$sql = "SELECT * FROM tbl_customer";
there is a column called CREATED_AT in my table and I want the user to be able to dynamically change the value of that in the page.
I mean:
SELECT * FROM tbl_customer
where CREATED_AT >= (here, the user should be able to adjust this field in the view of the page, otherwise he Will get several rows from different dates). I don't know how to do that :(
Also, I would like to display a load bar when clicking on export to Excel.

Simplest way to display MySQL data on a website with a table?

I am trying to display data from from a database in a table, with one column for the names and another for the values, instead of the rudimentary layout it currently has:
while($row = mysql_fetch_array($retval, MYSQL_ASSOC)) {
echo "{$row['date']} <br> ".
"--------------------------------<br>".
"Temperature :{$row['temperature']} <br> ".
"Luminosite : {$row['luminosite']} <br> ".
"Humidite : {$row['humidite']} <br> ".
"--------------------------------<br>";
}
I am very much a novice in all things php so any suggestions are welcome.
Try Using below code
echo "<table>
<tr>
<th>Date</th>
<th>Name</th>
<th>luminosite</th>
<th>humidite</th>
</tr>";
while($row = mysql_fetch_array($retval, MYSQL_ASSOC)) {
echo "<tr>
<td>".$row['date']."</td>
<td>".$row['temperature']."</td>
<td>".$row['luminosite']."</td>
<td>".$row['humidite']."</td>
</tr>";
}
echo "</table>";
Try to use this code
<html>
<head>
<title>Test</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
</head>
<body>
<div>
<div class="row">
<div class="table-responsive">
<table class="table table-striped table-hover" id="my_table">
<thead>
<tr>
<th>Temperature</th>
<th>Luminosite</th>
<th>Humidite</th>
</tr>
</thead>
<tbody>
<?php
$query = "select * from table";
$conn = mysqli_connect("localhost", "root", "password", "ecom");
$data = mysqli_query($conn, $query);
while ($row = mysqli_fetch_array($data))
{
$temperature = $row['temperature'];
$luminosite = $row['luminosite'];
$humidite = $row['humidite'];
echo "<tr><td>$temperature</td><td>$luminosite</td><td>$humidite</td></tr>";
}
; ?>
</tbody>
</table>
</div>
</div>
</div>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</body>
Try this code
<table>
<tr>
<td>Date</td><td>Temperature</td><td>Luminosite</td><td>Humidite</td>
</tr>
<?php
while($row = mysql_fetch_array($retval, MYSQL_ASSOC)) {
echo "<tr>
<td>$row['date']</td>
<td>$row['temperature']</td>
<td>$row['luminosite']</td>
<td>$row['humidite']</td>
</tr>";
}
?>
</table>
Do not use MySQL.
<table>
<tr>
<?php
while($row = mysql_fetch_array($retval, MYSQL_ASSOC)) {
?>
<td>
<?php echo "{$row['date']};?>
<td>
<td>
<?php echo "{$row['temperature']};?>
<td>
<!-- other fiels -->
<?php
}
?>
</tr>
</table>

Use Select option as search with dynamic fields

I am making a site linked with a database. It sorts transactions for budgeting reasons. For the store search section, I have a select drop down menu. I have linked up the data so that the drop down only shows stores that are in the database and automatically adds them as they change dynamically.
My issue is that I need a way to actually use the select options as search terms. Here is the initial page.
<!DOCTYPE html>
<html>
<head>
<title>Output 1</title>
</head>
<body>
<h1>Required Output 1</h1>
<h2>Transaction Search</h2>
<form action="output1out.php" method="get">
Search Store:<br/>
<input type="text" name="StoreName">
<br/>
<input name="Add Merchant" type="submit" value="Search">
</form>
<?php
require_once 'login.php';
$connection = mysqli_connect($db_hostname, $db_username,$db_password, $db_database);
if(mysqli_connect_error()){
die("Database Connection Failed: ".mysqli_connect_error()." (".mysqli_connect_errno().")");
};
$query = "SELECT * from PURCHASE";
//echo $query;
$result = mysqli_query($connection,$query);
if(!$result) {
die("Database Query Failed!");
};
$distinct = "SELECT DISTINCT StoreName FROM PURCHASE";
$distinctResult = mysqli_query($connection,$distinct);
if(!$result) {
die("Database Query Failed!");
};
echo '<select name="search_string" />'."\n";
while ($row = mysqli_fetch_assoc($distinctResult)){
echo '<option value="'.$row["StoreID"].'">';
echo $row["StoreName"];
echo '</option>'."\n";
};
echo '</select>'."\n";
mysqli_free_result($result);
mysqli_close($connection);
?>
Here is the output page.
<?php
$transaction = $_REQUEST["StoreName"];
require_once 'login.php';
$connection = mysqli_connect($db_hostname, $db_username,$db_password, $db_database);
$sql = "SELECT * FROM PURCHASE WHERE StoreName LIKE '%".$transaction."%'";
$result = $connection->query($sql);
?>
Purchases Made From <?php echo $transaction ?>
<table border="2" style="width:100%">
<tr>
<th width="15%">Item Name</th>
<th width="15%">Item Price</th>
<th width="15%">Purchase Time</th>
<th width="15%">Purchase Date</th>
<th width="15%">Category</th>
<th width="15%">Rating</th>
</tr>
</table>
<?php
if($result->num_rows > 0){
// output data of each row
while($rows = $result->fetch_assoc()){ ?>
<table border="2" style="width:100%">
<tr>
<td width="15%"><?php echo $rows['ItemName']; ?></td>
<td width="15%"><?php echo $rows['ItemPrice']; ?></td>
<td width="15%"><?php echo $rows['PurchaseTime']; ?></td>
<td width="15%"><?php echo $rows['PurchaseDate']; ?></td>
<td width="15%"><?php echo $rows['Category']; ?></td>
<td width="15%"><?php echo $rows['Rating']; ?></td>
</tr>
<?php
}
}
?>
I can get regular typing search to work but I can't think of a way to search using the same method. Is it possible?

Php - Search Box, pagination disappear when data from MySQL has shown

I have no clue anymore how I can solve this problem, components of Datatables have dissapeared : Searchbox, Pagination, number of length.
i thought it was caused by myself in the PHP code, but this is not the case.
there are many errors that are showing, id=example, error JSON response Second one AJAX error.
and now I found this, that is why I am asking my question now.
The code below shows just name but other components of the table are gone.
<table cellpadding="1" cellspacing="1" id="datatable" class="display" width="100%">
<thead>
<tr>
<th>Name</th>
<th>Phone</th>
<th>City</th>
<th>Email</th>
</tr>
</thead>
<tbody>
<?php
require_once("Connection.php");
$connection = new Connection();
$conn = $connection->getConnection();
try{
$sql = "SELECT * FROM identitas";
$getData = $conn->prepare($sql);
$getData->execute();
$result = $getData->fetchAll(PDO::FETCH_ASSOC);
foreach($result as $data){
?>
<tr>
<td><?php echo $data['nama']?></td>
</tr>
<?php
}
}catch(PDOException $e){
echo "ERROR : " . $e->getMessage();
}
?>
</tbody>
<tfoot>
<tr>
<th>Name</th>
<th>Phone</th>
<th>City</th>
<th>Email</th>
</tr>
</tfoot>
</table>
how to call Datatables
<!-- for data table-->
<link rel="stylesheet" type="text/css" href="DataTables-1.10.11/media/css/jquery.dataTables.css">
<script type="text/javascript" src="DataTables-1.10.11/media/js/jquery-1.12.1.min.js"></script>
<script type="text/javascript" src="DataTables-1.10.11/media/js/jquery.dataTables.min.js"></script>
<!-- javascript-->
<script type="text/javascript">
$(document).ready(function(){
$('#datatable').dataTable({
"dom": '<"top"fl>rt<"bottom"ip><"clear">'
});
});
</script>

Fusion Table Response into HTML Table

I am trying to get a Fusion Table SQL response into a basic HTML table. This is for both search engine fodder and for use with google spreadsheets and their importhtml function.
The foreach to turn the response into a table are turning up some unusual responses, like 1 character at a time? Also the response appears to be formatted as something that can easily be made into an array, but my efforts have been futile. Have been working on this for over two days now, and I bet someone understands the formatting and knows the answer far better than I?
<?php
$result = file_get_contents("https://www.googleapis.com/fusiontables/v1/query?sql=SELECT%20*%20FROM%201QN6e86FybBULPekKvvXd_RF1jw01H7bZAJFjhUg&key=AIzaSyAm9yWCV7JPCTHCJut8whOjARd7pwROFDQ");
?>
<!DOCTYPE html>
<html>
<body>
<div id="page">
<h1>A Table of Clicks</h1>
<table class='data'>
<thead>
<tr>
<th>date</th>
<th>fundraiser</th>
<th>name</th>
<th>link</th>
<th>price</th>
<th>image</th>
<th>ip</th>
<th>merchant</th>
</tr>
</thead>
<tbody>
<?php
list($part1, $part2) = explode(' "rows": [[', $result);
$rows = explode(' ], [', $part2);
echo $rows[0]."<br>";
foreach ($rows as $row) {
{
//$array = array($row);
///var_dump($array);
$boxes = explode(",", $row);
foreach ($boxes as $box) {
echo "
<tr>
<td>".$box[0]."</td>
<td>".$box[1]."</td>
<td>".$box[2]."</td>
<td>".$box[3]."</td>
<td>".$box[4]."</td>
<td>".$box[5]."</td>
<td>".$box[6]."</td>
<td>".$box[7]."</td>
</tr>";
}
}
}
?>
</tbody>
</table>
<hr />
</div>
</body>
Use json_decode to parse the response(it's valid JSON):
<?php
$result = file_get_contents("https://www.googleapis.com/fusiontables/v1/query?sql=SELECT%20*%20FROM%201QN6e86FybBULPekKvvXd_RF1jw01H7bZAJFjhUg&key=AIzaSyAm9yWCV7JPCTHCJut8whOjARd7pwROFDQ");
$result=json_decode($result,true);
?>
<!DOCTYPE html>
<html>
<body>
<div id="page">
<h1>A Table of Clicks</h1>
<table class='data'>
<thead>
<tr>
<th><?php echo implode('</th><th>',$result['columns']);?></th>
</tr>
</thead>
<tbody>
<?php
foreach($result['rows'] as $row){
echo '<tr><td>'.implode('</td><td>',$row).'</td></tr>';
}
?>
</tbody>
</table>
<hr />
</div>
</body>

Categories