So, I think I may be in over my head. I've looked around on here for a quite some time but have not been able to find something that will help me.
I am trying to build a display order from, similar to what you would see in a restaurant or fast food, that automatically and smoothly updates when a new entry has been entered into the MySQL table.
I tryed using AJAX but I could not get it to work
Main PHP page
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"> </script>
<scriptsrc="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link rel="stylesheet" type="text/css" href="css/style.css">
<script src="js/fulfillment.js"></script>
<link href="https://gitcdn.github.io/bootstrap-toggle/2.2.2/css/bootstrap-toggle.min.css" rel="stylesheet">
<script src="https://gitcdn.github.io/bootstrap-toggle/2.2.2/js/bootstrap-toggle.min.js"></script>
</head>
<body>
<div class="container">
<h1>Orders</h1>
<p>Area that displays all of the active and past orders.</p>
<div align="right">
<input id="toggle-event" type="checkbox" checked data-toggle="toggle" data-on="Active" data-off="Past">
</div>
<!-- Active Orders -->
<?php
include '../connect.php';
//get information form tblOrder
$sql = "SELECT * FROM tblOrder WHERE Filled=0";
$result = $db->query($sql);
if (!$result) {
die('Invalid query: ' . mysql_error());
}
?>
<!-- Build the table -->
<h2>Active</h2>
<table ID = "myTable" class="table table-striped">
<thead>
<tr>
<th>Order Number</th>
<th>User ID</th> <!-- will turn to user name later down the road -->
<th>Food</th>
<th>Pick Up Time</th>
<th>Filled</th>
</tr>
</thead>
<tbody>
<?php
// run though tblOrders
if ($result->num_rows > 0) {
// output data of each row
while($row = $result->fetch_assoc()) {
//assign all of the values
$OrderNumber = $row["Order_Number"];
$FoodID = $row["F_ID"];
$DrinkID = $row["D_ID"];
$UserID = $row["User_ID"];
$Filled = $row["Filled"];
$RequestTime = $row["Request_Time"];?>
<!-- out put each line of the value -->
<tr>
<td><?php echo $OrderNumber; ?></td>
<td><?php echo $UserID; ?></td> <!-- switch to name once it is avalible ->
<td><!-- put food order here --></td>
<td><?php echo $RequestTime; ?></td>
<td><input type="button" class="btn btn-default" value="Complete"onclick="toPast(this, <?php echo $OrderNumber?>)"/></td>
</tr>
<?php
}
}
//close the data connection
$db->close();
?>
</tbody>
</table>
JavaScript
function toPast(btn, ONum) {
var dataString = 'OrderNumber=' + ONum + '&UpdateNumber=' + '1';
$.ajax({
type: "POST",
url: "update_sucess.php",
data: dataString,
cache: false,
success: function(html) {
//alert(html);
var row = btn.parentNode.parentNode;
row.parentNode.removeChild(row);
}
});
}
Could anyone point me in the right direction or know someplace has a "how-to" on how to do this that I could read?
Related
I have a table on my website, which gets data from a database, in the table I have delete buttons on a row, I have just made the table searchable with jQuery, but now I can't figure out how to keep the delete buttons.
index.php:
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta charset="utf-8">
<meta name="description" content="Inventar">
<meta name="author" content="Martin Eide Bjørndal">
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css">
<link rel="stylesheet" href="/src/css/style.css">
<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<!-- Popper JS -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"></script>
</head>
<body>
<button class="back" onclick="window.location='../'">
<img src="/src/icons/back.png">
</button> <!-- Tilbake knapp -->
<button class="ny_inventar" onclick="window.location='/admin/brukere/ny'">
<img src="/src/icons/add.png">
</button> <!-- Ny Bruker knapp -->
<div class="container-fluid" id="utskjekkcontainer">
<div class="row justify-content-center">
<div class="col-mv-10 bg-light mt-5 rounded p-3">
<h1 class="text-primary p-2">Brukere</h1>
<hr>
<div class="form-inline">
<label for="search" class="font-weight-bold lead text-dark">Søk</label>
<input type="text" name="search" id="search_text" class="form-control form-control-lg rounded-0 border-primary" placeholder="Søk...">
</div>
<hr>
<?php
include "../../src/fn/init.php";
$stmt=$conn->prepare("SELECT * FROM brukere");
$stmt->execute();
$result=$stmt->get_result();
?>
<table class="table table-hover table-light table-striped" id="table_data">
<thead>
<tr>
<th>#</th>
<th>Fornavn</th>
<th>Etternavn</th>
<th>Utskjekket</th>
<th>Admin</th>
<th>Slett</th>
</tr>
</thead>
<tbody>
<?php while($row=$result->fetch_assoc()){ ?>
<tr>
<td><?php echo $row["id"]; ?></td>
<td><?php echo $row["fornavn"]; ?></td>
<td><?php echo $row["etternavn"]; ?></td>
<td><?php echo $row["utskjekket"]; ?></td>
<td><?php echo $row["is_admin"]; ?></td>
<td>Slett</td>
</tr>
<?php }
$conn->close();
?>
</tbody>
</table>
</div>
</div>
</div>
<script type="text/javascript">
$(document).ready(function(){
$('#search_text').keyup(function(){
var search = $(this).val();
$.ajax({
url:'action.php',
method:'post',
data:{query:search},
success:function(response){
$('#table_data').html(response);
}
});
});
});
</script>
</body>
</html>
action.php:
<?php
include "../../src/fn/init.php";
$output = "";
if(isset($_POST["query"])){
$search = $_POST["query"];
$stmt = $conn->prepare("SELECT * FROM brukere WHERE fornavn LIKE CONCAT('%',?,'%') OR etternavn LIKE CONCAT('%',?,'%') OR id LIKE CONCAT('%',?,'%')");
$stmt->bind_param("sss",$search, $search, $search);
} else {
$stmt=$conn->prepare("SELECT * FROM brukere");
};
$stmt->execute();
$result=$stmt->get_result();
if($result->num_rows>0){
$output = "<thead>
<tr>
<th>#</th>
<th>Fornavn</th>
<th>Etternavn</th>
<th>Utskjekket</th>
<th>Admin</th>
<th>Slett</th>
</tr>
</thead>
<tbody>";
while($row=$result->fetch_assoc()){
$output .= "
<tr>
<td>".$row["id"]."</td>
<td>".$row["fornavn"]."</td>
<td>".$row["etternavn"]."</td>
<td>".$row["utskjekket"]."</td>
<td>".$row["is_admin"]."</td>
<td>".Slett."</td>
</tr>";
};
$output .= "</tbody>";
echo $output;
} else {
echo "<h3>No match found!</h3>";
};
?>
This is the search script, the problem is in the while loop where the link is added, I can't figure out how to make it work.
The a tag is not added as a plain-text to the output string, you need to rewrite that line, concatenate strings parts to variables parts correctly.
Try replacing:
$output .= "
<tr>
<td>".$row["id"]."</td>
<td>".$row["fornavn"]."</td>
<td>".$row["etternavn"]."</td>
<td>".$row["utskjekket"]."</td>
<td>".$row["is_admin"]."</td>
<td>".Slett."</td>
</tr>";
with:
$output .= "
<tr>
<td>".$row["id"]."</td>
<td>".$row["fornavn"]."</td>
<td>".$row["etternavn"]."</td>
<td>".$row["utskjekket"]."</td>
<td>".$row["is_admin"]."</td>
<td><a href='delete.php?id=".urlencode($row['id'])."' onclick='return confirm('Er du sikker?');'>Slett</a></td>
</tr>";
To allow PHP to echo the id from the table result you need to just simply do a php echo
Slett
You don't have to url encode at this stage as you are just simply building the href of an a:link
You can use it
<?php
include "../../src/fn/init.php";
$output = "";
if(isset($_POST["query"])){
$search = $_POST["query"];
$stmt = $conn->prepare("SELECT * FROM brukere WHERE fornavn LIKE CONCAT('%',?,'%') OR etternavn LIKE CONCAT('%',?,'%') OR id LIKE CONCAT('%',?,'%')");
$stmt->bind_param("sss",$search, $search, $search);
} else {
$stmt=$conn->prepare("SELECT * FROM brukere");
};
$stmt->execute();
$result=$stmt->get_result();
if($result->num_rows>0){
$output = "<thead>
<tr>
<th>#</th>
<th>Fornavn</th>
<th>Etternavn</th>
<th>Utskjekket</th>
<th>Admin</th>
<th>Slett</th>
</tr>
</thead>
<tbody>";
while($row=$result->fetch_assoc()){
$output .= "
<tr>
<td>".$row["id"]."</td>
<td>".$row["fornavn"]."</td>
<td>".$row["etternavn"]."</td>
<td>".$row["utskjekket"]."</td>
<td>".$row["is_admin"]."</td>
<td>Slett </td>
</tr>";
};
$output .= "</tbody>";
echo $output;
} else {
echo "<h3>No match found!</h3>";
};
This is how I make a table of the files in a directory, they will be pdf or images, my first goal is to get just a part of title (which will be separated as I like lets say number_nam_company_color.pdf) and I have to take those informations to a table as links, when clicked they open in a window like with a button, and I'm not sure if I'm getting those files the right way.
<!DOCTYPE html>
<html>
<head>
<title>Aceuil</title>
<link href="https://fonts.googleapis.com/css?family=Lato:100" rel="stylesheet" type="text/css">
<link href="{{asset('css/style.css')}}" rel="stylesheet">
<script type="text/javascript" src="{{ URL::asset('js/jquery.js') }}"></script>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<div >
<div >
<table class="grey">
<tbody>
<tr>
<th>number</th>
<th>nam</th>
<th>company</th>
<th>color</th>
<th>date</th>
</tr>
<tr>
<?php
$dirname = 'myfiles';
$dir = opendir($dirname);
while($file = readdir($dir)) {
if($file != '.' && $file != '..' && !is_dir($dirname.$file)) {
?>
<td>
<?php
echo ''.$file.'';
?>
</td>
<td>
<?php
echo ''.$file.'';
?>
</td>
<td>
<?php
echo ''.$file.'';
?>
</td>
<td>
<?php
echo ''.$file.'';
?>
</td>
<td>
<?php
echo "filectime($dirname . '/' . $file))";
?>
</td>
</tr>
<?php
}
}
closedir($dir);
?>
</div>
</div>
</body>
</html>
t worked with this :
$data = "$file";
list($numero,$nom,$marque,$couleur) = explode("_", $data);
echo ''.$numero.'';//in the same way i can get anything i want from the title
echo ''.$nom.'';
and i want to open that pdf file in a window not with chrome?
What I want to be able to do:
I have a page setup so that a table is populated with values from the database. I also generate a button for each of the rows on the table. The button is connected to the database to a field called status. It is initially at 0. When the button is clicked, I want to be able to update this value by incrementing it by 1.So after the button is clicked on the webpage, the database status value is incremented by 1.
I have tried using AJAX for this, but I havent seemed to have much luck.
view.php (Where the table is populated from the database)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>View</title>
<link rel="stylesheet" type="text/css" href="css/style.css">
<link rel="stylesheet" type="text/css" href="css/bootstrap.css">
</head>
<body>
<?php
include 'php/connect.php';
include 'php/status.php';
function getStatus($num){
$status = "";
switch ($num) {
case ($num == 0):
$status = "Pending";
case ($num == 1):
$status = "Completed";
default:
$status = "Pending";
}
return $status;
}
?>
<div class="container">
<div class="row">
<div class="col-md-12 center-block">
<h1>View the Commissions</h1>
<div class="panel panel-default">
<div class="panel-heading">Commissions</div>
<div class="panel-body">
<p></p>
</div>
<table class="table">
<thead>
<tr>
<th>#</th>
<th>Alias</th>
<th>Description</th>
<th>Price</th>
<th>Status</th>
</tr>
</thead>
<tbody>
<?php
$query = mysqli_query($connect, "SELECT * FROM orders") or die(mysql_error());
while ($row = mysqli_fetch_array($query)) {
echo "<tr>";
echo "<th scope=\"row\">";
echo $row['orderID'];
echo "</th>";
echo "<th>".$row['alias']."</th>";
echo "<th>".$row['description']."</th>";
echo "<th>$".$row['price']."</th>";
echo "<th><button type=\"button\" class=\"btn btn-default btn-info\" name=\"" .$row['orderID']. "\">".getStatus($row['status'])."</button></th>";
echo "</tr>";
}
?>
</tbody>
</table>
</div>
</div>
</div>
</div>
</body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script type="text/javascript">
</script>
</html>
As you can see, for each row in the database the table is populated. Here is an image of the webpage:
I did have this code for the AJAX. It did give me the correct output in the console of the browser, but I wasnt able to get this value into the process.php page
$.ajax({
url: 'php/process.php',
type: 'POST',
data: {
orderID: obj.id
},
success: function (data) {
console.log(data);
}
});
How would I have it so that as soon as the button is clicked, it updates the value and refreshes the page. Any help would be greatly appreciated
TLDR; When I click the "Pending" button, a value in the database is incremented by 1.
Your getStatus() function didn't have break statement. for simple POST use $.post. I have added .status class to your button to use it as selector with jQuery
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>View</title>
<link rel="stylesheet" type="text/css" href="css/style.css">
<link rel="stylesheet" type="text/css" href="css/bootstrap.css">
</head>
<body>
<?php
include 'php/connect.php';
include 'php/status.php';
// fixed this function by adding break and removing $num from case statement
function getStatus($num)
{
$status = "";
switch ($num) {
case 0:
$status = "Pending";
break;
case 1:
$status = "Completed";
break;
default:
$status = "Pending";
}
return $status;
}
?>
<div class="container">
<div class="row">
<div class="col-md-12 center-block">
<h1>View the Commissions</h1>
<div class="panel panel-default">
<div class="panel-heading">Commissions</div>
<div class="panel-body">
<p></p>
</div>
<table class="table">
<thead>
<tr>
<th>#</th>
<th>Alias</th>
<th>Description</th>
<th>Price</th>
<th>Status</th>
</tr>
</thead>
<tbody>
<?php
$query = mysqli_query($connect, "SELECT * FROM orders") or die(mysql_error());
while ($row = mysqli_fetch_array($query)) : ?>
<tr>
<th scope="row"><?php echo $row['orderID']; ?></th>
<th><?php echo $row['alias']; ?></th>
<th><?php echo $row['description']; ?></th>
<th><?php echo $row['price']; ?></th>
<th>
// added .status class here
<button type="button" class="btn btn-default btn-info status"
name="<?php echo $row['orderID']; ?>"><?php echo getStatus($row['status']); ?></button>
</th>
</tr>
<?php endwhile; ?>
</tbody>
</table>
</div>
</div>
</div>
</div>
</body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script type="text/javascript">
// the AJAX for updating the status
$('.status').on('click', function () {
var id = $(this).attr('name');
var btn = $(this);
$.post('php/process.php', {orderId: id}, function (response) {
var res = JSON.parse(response);
if (res.results == true) {
btn.html('Completed');
}
})
})
</script>
</html>
In php/process.php
<?php
include 'php/connect.php';
if (isset($_POST['orderId'])) {
$orderId = $_POST['orderId'];
$sql = "UPDATE `orders` SET `status`= 1 WHERE `orderID` = $orderId";
if (mysqli_query($connect, $sql)) {
echo json_encode(['results' => true]); // when update is ok
}else {
echo json_encode(['results' => false]); // when update fail
}
}
I'm having some trouble with this code pinpointing exactly where the problems coming from, I'm not sure if theres a problem with the javascript but when I go to select a record from select.php it just ends up stalling.. (nothing happens ;/)
confirmDelete.js
function fnConfirm(delUrl) {
if (confirm("Are you sure you want to delete this record?")) {
window.location = delUrl;
}
var linkDel = document.getElementById("linkDelete");
linkDel.onclick= fnConfirm;
select.php
<?php header("Cache-Control:no-cache"); ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Delete Cabin -AdminPanel</title>
<link rel="stylesheet" type="text/css" href="stylesheet.css" />
</head>
<body>
<script src="confirmDelete.js"></script>
<h2>Select from the cabins listed below to delete:</h2>
<?php
//connect to server and database
include 'sqldb_connect.inc.php';
//set up query
$query = "SELECT * FROM tblCabins";
//execute query
$result = mysql_query($query);
if(!$result)
{
mysql_close();
exit("Error retrieving cabins from database");
}
//get the number of rows in the cabins table and store in a variable
if(mysql_num_rows($result) <1)
{
mysql_close();
exit("No cabin entries found");
}
//start table
?>
<!--.......................................................................-->
<table>
<tr>
<th>cabinID</th>
<th>Cabin Type</th>
<th>Cabin Description</th>
<th>Price per night</th>
<th>Price per week</th>
<th>Photo</th>
<th> </th>
</tr>
<!--.......................................................................-->
<?php
//fetch the next row (or record) of the result set until there are no more left
while($row = mysql_fetch_array($result))
{
//store the results in variables
$cabinID = $row['cabinID'];
$cabintype = $row['cabinType'];
$cabindesc = $row['cabinDescription'];
$pricepern = $row['pricePerNight'];
$priceperw = $row['pricePerWeek'];
$photo = $row['PHOTO'];
?>
<!--.......................................................................-->
<tr>
<td><?= $cabinID; ?></td>
<td><?= $cabintype; ?></td>
<td><?= $cabindesc; ?></td>
<td><?= $pricepern; ?></td>
<td><?= $priceperw; ?></td>
<td><?= $photo; ?></td>
<td><a id="linkDelete" href="javascript:fnConfirm('cabinDelete_process.php?cabinID=<?= "$cabinID"; ?>')">Delete</a></td>
</tr>
<!--.................................................................................-->
<?php
}
mysql_close();
?>
<!--.................................................................................-->
</table>
</body>
</html>
process.php
<?php header("Cache-Control:no-cache"); ?>
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>deleteCabinProcess - adminPanel</title>
<link rel="stylesheet" type="text/css" href="stylesheet.css">
</head>
<body>
<?php
//this page will delete the cabin
//selected from the previous page
//read cabinID passed to this page
$cabinID = $_GET['cabinID'];
//connect to server and database
include 'sqldb_connect.inc.php';
//set up query
$query = "DELETE FROM tblCabins WHERE cabinID = '$cabinID'";
//execute query
$result = mysql_query($query);
if(!$result)
{
mysql_close();
exit("Error deleting Cabin from the database");
}
mysql_close();
exit ("Successfully deleted the record from the database ");
?>
</body>
</html>
If anyone can see any problems it'd be greatly appreciated.. Brb need to go outside and adjust my eyes!
Apologies in advance if a) this question has already been answered, I did search but am not able to use the answers I've found and b) I am not the a very skilled programmer and am trying to learn...
To make this as short as possible...
I have a fully functioning site with a searchable and sortable database (that a co-worker pretty much build for me a long time ago, hence why I am extra confused)
I would like to add a dropdown filter that populates from the database
The code references javascript and PHP. From what I understand, the PHP populates the table data for me and the javascript triggers the 'show xx entries' filter and the search box - which are both awesome
My issue is I cannot get any code for the dropdown I would like to add to work. I can get the dropdown to populate but not actually filter the data :(
<?php
$dbhost = 'localhost';
$dbuser = 'database';
$dbpass = 'password;
$dbname = 'marchmadness';
$table = 'leaderboard';
//connect to the database
$db = mysql_connect($dbhost, $dbuser, $dbpass) or die(mysql_error());
mysql_select_db($dbname) or die(mysql_error());
?>
<!DOCTYPE html>
<html lang="en">
<head>
<title>Leaderboard</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="icon" type="image/png" href="/favicon.ico" />
<link rel="stylesheet" type="text/css" href="assets/css/main.css">
<link rel="stylesheet" type="text/css" href="assets/css/listing.css" media="all" />
<script type="text/javascript" src="assets/js/jquery.min.js"></script>
<script type="text/javascript" language="javascript" src="assets/js/jquery.dataTables.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
/* This triggers the cool filtering stuff, without this it's just a normal table of data */
$('table').dataTable({
"iDisplayLength": 10
});
});
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
</script>
</head>
<body id="listing">
<div id="wrapper">
<div id="topbox" align="center">
<img src="_Images/maddnessheader.png" width="539" height="296" align="center" /></div>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
<?
$sql="SELECT Title FROM leaderboard";
$result=mysql_query($sql);
$options="";
while ($row=mysql_fetch_array($result)) {
$id=$row["leaderboard"];
$thing=$row["Title"];
$options.="<OPTION VALUE=\"$id\">".$thing.'</option>';
}
?>
<SELECT NAME=thing>
<OPTION VALUE=0>Choose
<?=$options?>
</SELEC
T>
<table align="center">
<thead>
<tr>
<th>Title</th>
<th>Name</th>
<th>Call Coding (%)</th>
<th>FizzBack SAT Score (%)</th>
</tr>
</thead>
<tbody>
<?php
//get the information from the database
$result = mysql_query("SELECT * FROM `$table`;") or die(mysql_error());
while($row = mysql_fetch_array($result)) {
echo '<tr>';
// print out the data from the database. Notice how the text inside $row[] matches up with the headers in phpmyadmin
echo '<td>' . htmlentities($row['Title']) . '</td>';
echo '<td>' . htmlentities($row['Name']) . '</td>';
echo '<td>' . htmlentities($row['CC']) . '</td>';
echo '<td>' . htmlentities($row['FZB']) . '</td>';
echo "</tr>\n";
}
?>
</tbody>
</table>
</div>
</body>
</html>
I think I would have to manipulate the javascript to add what I need, as that's where the the working dropdown and search box come from... but I suck a javascript :-\ If anyone could help I would REALLY appreciate it. I can share the existing Java as well if needed :D
Cheers!
Give this a try, Ive edited a few things which didn't seem quite right and added some code which should hopefully filter stuff. Bit of a guess as I've never used datatables and I dont know what the datatypes are.
<?php
$dbhost = 'localhost';
$dbuser = 'database';
$dbpass = 'password';
$dbname = 'marchmadness';
$table = 'leaderboard';
//connect to the database
$db = mysql_connect($dbhost, $dbuser, $dbpass) or die(mysql_error());
mysql_select_db($dbname) or die(mysql_error());
?>
<!doctype html>
<html lang="en">
<head>
<title>Leaderboard</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="icon" type="image/png" href="/favicon.ico" />
<link rel="stylesheet" type="text/css" href="assets/css/main.css">
<link rel="stylesheet" type="text/css" href="assets/css/listing.css" media="all" />
<script type="text/javascript" src="assets/js/jquery.min.js"></script>
<script type="text/javascript" language="javascript" src="assets/js/jquery.dataTables.min.js"></script>
<script type="text/javascript">
var table; // used to store a reference later
$.fn.dataTablesExt.afnFiltering.push(
function( oSettings, aData, iDataIndex ) {
if (aData[0].toLowerCase() == $('#title_filter').val().toLowerCase()) {
return true;
} else {
return false;
}
}
);
$(document).ready(function() {
/* This triggers the cool filtering stuff, without this it's just a normal table of data */
table = $('table').dataTable({ "iDisplayLength": 10 }); // this starts the datatable stuff and returns a reference to it
});
$("#title_filter").onchange(function() {
table.fnDraw(); // forgot this line - whoops
});
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
</script>
</head>
<body id="listing">
<div id="wrapper">
<div id="topbox" align="center">
<img src="_Images/maddnessheader.png" width="539" height="296" align="center" /></div>
<?php
$sql="SELECT Title FROM leaderboard";
$result=mysql_query($sql);
$options="";
while ($row=mysql_fetch_array($result)) {
$id=$row["leaderboard"];
$thing=$row["Title"];
$options.="<option value=\"$thing\">".$thing.'</option>';
}
?>
<select id="title_filter">
<?=$options?>
</select>
<table align="center">
<thead>
<tr>
<th>Title</th>
<th>Name</th>
<th>Call Coding (%)</th>
<th>FizzBack SAT Score (%)</th>
</tr>
</thead>
<tbody>
<?php
//get the information from the database
$result = mysql_query("SELECT * FROM `$table`;") or die(mysql_error());
while($row = mysql_fetch_array($result)) {
echo '<tr>';
// print out the data from the database. Notice how the text inside $row[] matches up with the headers in phpmyadmin
echo '<td>' . htmlentities($row['Title']) . '</td>';
echo '<td>' . htmlentities($row['Name']) . '</td>';
echo '<td>' . htmlentities($row['CC']) . '</td>';
echo '<td>' . htmlentities($row['FZB']) . '</td>';
echo "</tr>\n";
}
?>
</tbody>
</table>
</div>
</body>
</html>