Background
I have a database which has a table called menuitems. The menuitems store attributes of a menu of a resteraunt. The columns include "itemno, name, price, discount, category"
The menu items are displayed via sql in the menu.php page. You have two options. You can either click on the Food Category or Beverage category.
Upon clicking the Food category, for example. It will display the "name" and "price" under the columns "Items" and "Unit Price"
Now this webpage is done by someone else. My job, is to try to figure out a way to get the Quantities of this order and insert the order into the "orderdb" table
The "orderdb" table has orderid (autoincrement), itemno, qty, idtable, subtotal. The subtotal is calculated by multiplying the itemno and quantity.
This is the code.
What I have done uptil now, is created a textfield on the menu.php page where the user can enter the quantity and I have created a button that says "+" representing to add the order into the orderdb table.
But I am not sure what else to do. I know how to execute this in simply SQL language and its terminology but my PHP is very weak.
This is my code uptil now.
<!DOCTYPE html>
<html>
<title>Menu List</title>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
#foodDIV {
width: 100%;
padding: 50px 0;
text-align: center;
background-color: lightblue;
height:400px;
width:500px;
display: none;
}
#bevDIV2 {
width: 100%;
padding: 50px 0;
text-align: center;
background-color: pink;
height:400px;
width:500px;
display:none;
}
#menuNav {
border: 1px solid #ccc;
background-color: #f1f1f1;
}
/* Style the buttons inside the tab */
.menuNav button {
background-color: inherit;
float: left;
border: none;
outline: none;
padding: 14px 16px;
font-weight:bold;
font-size: 18px;
}
/* Change background color of buttons on hover */
.menuNav button:hover {
background-color: #ddd;
}
th {
padding-top: 12px;
padding-bottom: 12px;
width:150px;
color: white;
}
</style>
</head>
<body>
<div class="menuNav">
<button onclick="categorize('food')">Food</button>
<button onclick="categorize('beverage')">Beverage</button>
</div>
<div id="foodDIV">
<table>
<tr>
<th>Items</th>
<th>Unit Price</th>
<th>Qty</th>
<th>Add item</th>
<th> Remove Item</th>
</tr>
<?php
$conn=mysqli_connect("localhost","root","","tabletable");
if($conn->connect_error){
die("Connection failed:".$conn->connect_error);
}
$sql= "SELECT name,price from menuitems where category='Food'";
$result =$conn ->query($sql);
if($result-> num_rows>0){
while($row=$result->fetch_assoc()){
echo "<tr><td>".$row["name"]."</td><td>".$row["price"]."</td><td><input type='number' name='fquantity'></td><td><input type='button' value='+'></td><td><input type='button' value='-'></td></tr>";
}
echo"</table>";
}
else{
echo "0 result ";
}
$conn->close();
?>
</table>
</div>
<div id="bevDIV2">
<table>
<tr>
<th>Items</th>
<th>Unit Price</th>
<th>Qty</th>
<th>Add item</th>
<th>Remove item</th>
</tr>
<?php
$conn=mysqli_connect("localhost","root","","tabletable");
if($conn->connect_error){
die("Connection failed:".$conn->connect_error);
}
$sql= "SELECT name,price from menuitems where category='Beverage'";
$result =$conn ->query($sql);
if($result-> num_rows>0){
while($row=$result->fetch_assoc()){
echo "<tr><td>".$row["name"]."</td><td>".$row["price"]."</td><td><input type='number' name='bquantity'></td><td><input type='button' value='+'></td><td><input type='button' value='-'></td></tr>";
}
echo"</table>";
}
else{
echo "0 result ";
}
$conn->close();
?>
</table>
</div>
<script>
function categorize(ctg) {
if(ctg=='food'){
var x = document.getElementById("foodDIV");
var y=document.getElementById("bevDIV2");
if (x.style.display !== "block"){
x.style.display = "block";
}
if (y.style.display !== "none"){
y.style.display = "none";
}
}
else if(ctg=='beverage'){
var x = document.getElementById("bevDIV2");
var y=document.getElementById("foodDIV");
if (x.style.display !== "block"){
x.style.display = "block";
}
if (y.style.display !== "none"){
y.style.display = "none";
}
}
}
</script>
</body>
</html>
Where do I go from here?
Image1
