Blank options following Correct options in html select - php

I created a select option and populated it with a mysqli query from the database. But there are blank options below the correct options in the dropdown menu.
This is my php page with select option:
<!DOCTYPE html>
<!DOCTYPE html>
<?php
include("includes/connect.php");
function getcats_add_products(){
global $con;
$get_cats="select * from categories";
$run_cats=mysqli_query($con, $get_cats);
echo "<option>Select Category</option>";
while($row_cats = mysqli_fetch_array($run_cats)){
$cat_id = $row_cats['cat_id'];
$cat_title = $row_cats['cat_title'];
echo "<option value='$cat_id'>$cat_id, $cat_title<option>";
}
}
?>
<html>
<head>
<title>Admin Panel - Add Products</title>
<link rel="stylesheet" type="text/css" href="styles/admin-style.css">
</head>
<body>
<header class="header">
</header>
<div class="heading">Add New Product</div>
<div class="product-table-div">
<form>
<table class="product-table">
<tr>
<td>Product Category</td>
<td>
<select id="product-table-input" >
<?php getcats_add_products(); ?>
</select>
</td>
</tr>
<tr>
<td>Product Brand</td>
<td>
<input type="" name="" id="product-table-input">
</td>
</tr>
<tr>
<td>Product title</td>
<td>
<input type="" name="" id="product-table-input">
</td>
</tr>
<tr>
<td>Product Price</td>
<td>
<input type="" name="" id="product-table-input">
</td>
</tr>
<tr>
<td>Product description</td>
<td>
<input type="" name="" id="product-table-input">
</td>
</tr>
<tr>
<td>Product image</td>
<td>
<input type="" name="" id="product-table-input">
</td>
</tr>
<tr>
<td>Product Keywords</td>
<td>
<input type="" name="" id="product-table-input">
</td>
</tr>
<tr>
<td colspan="2">
<div id="product-submit-div">
<input type="submit" name="submit" id="product-submit" value="Add">
</div>
</td>
</tr>
</table>`enter code here`
</form>
</div>
<?php getcats_add_products(); ?>
</body>
</html>
This is the css file:
header {
height: 100px;
background: #006b00; /* For browsers that do not support gradients */
background: -webkit-linear-gradient(#006b00, #00fa00); /* For Safari 5.1 to 6.0 */
background: -o-linear-gradient(#006b00, #00fa00); /* For Opera 11.1 to 12.0 */
background: -moz-linear-gradient(#006b00, #00fa00); /* For Firefox 3.6 to 15 */
background: linear-gradient(#006b00, #00fa00);
}
.heading {
margin: 20px;
text-align: center;
width: 100%;
color: #001A00;
font-size: 25px;
font-weight: bold;
}
.product-table-div {
width: fit-content;
margin: auto;
display: block;
}
.product-table {
table-layout: auto;
height: auto;
background-color: #00CC8A;
}
.product-table td {
font-size: 20px;
text-align: left;
}
#product-submit-div {
text-align: center;
max-width: 100%;
}
#product-submit {
border: 0px;
height: 100%;
width: 30%;
line-height: 20px;
font-size: 20px;
border-radius: 3px;
}
This is my connect page:
<?php
$con = mysqli_connect("localhost", "root", "root", "ecommerce");
if(!$con){
die('connection error: '.$mysqli->connect_error());
}
?>
This is how the select option is looking after populating with data:
Select options followed by spaces
This is the table i am querying:
Database table
I cannot make sure if it is a mysql problem or css problem. The spaces are not between the first tag and the second. There are blank options following only the tags which i am pulling from the database.


You're missing closing tag, therefore, you get additional empty space after each option.
echo "<option value='".$cat_id."'>".$cat_title."</option>";
This is the reason why you're getting empty line after each select option.


You have added two time the Start of the HTML document and that it not advisable and you have to remove that from the code.
Remove two time that you have added <!DOCTYPE html>
Reason for not displaying the Options in the select tag:
You have not concatenated the string properly over the echo that you have added onto the select tag. Hence your select tag will not display any value in the option value and you need to change the entire function like this in order to display the values over to the option tag.
Instead of using the mysqli_fetch_array() you can use the mysqli_fetch_assoc() and you can get the single row at a time in the while loop so that you can modify the data as needed. Like the same you need to follow for the mysqli_fetch_array().
mysqli_fetch_array() - Method
PHP Code:
<?php
include("includes/connect.php");
function getcats_add_products(){
global $con;
$get_cats="select * from categories";
$run_cats=mysqli_query($con, $get_cats);
echo "<option>Select Category</option>";
while($row_cats = mysqli_fetch_array($run_cats)){
$cat_id = $row_cats['cat_id'];
$cat_title = $row_cats['cat_title'];
echo "<option value=".$cat_id.">".$cat_title."<option>";
}
}
?>
mysqli_fetch_assoc()- Method
PHP Code:
<?php
include("includes/connect.php");
function getcats_add_products(){
global $con;
$get_cats="select * from categories";
$run_cats=mysqli_query($con, $get_cats);
echo "<option>Select Category</option>";
while($row_cats = mysqli_fetch_assoc($run_cats)){
$cat_id = $row_cats['cat_id'];
$cat_title = $row_cats['cat_title'];
echo "<option value=".$cat_id.">".$cat_title."<option>";
}
}
?>
Note: Both will follow up the same methods of the looping structure so that you can decide which one to use and both are the same as you see when it displays the output.
But see to that in the above code how the concatenation is done and you have to do like this alone.
And in the default way you have to pass the ID or Value in the option value and then One more parameter in the Outside of the Option value.
Replace:
echo "<option value='$cat_id'>$cat_id, $cat_title<option>";
With:
echo "<option value=".$cat_id.">".$cat_title."<option>";
Hope so my explanation would be clear and you can rectify it for future purposes.
Happy Coding :)

Related

display value from php table when clicking on a button on another page

Following is the table i created for displaying the Restaurant Name, Location and Menu for table owners.
Now each of the row for the column Menu have Button as values.
My table is ready with perfect values.
NOW MY PROBLEM IS HOW TO DO:-
Upon clicking the button corresponding to the each Restaurant, a new File(openmenu.php) will open and will echo the Restaurant Name, Mobile Number of that Restaurant and the menu.
But so far, on clicking every Button ,I can only display above entries of the Last row of the table. Help Me Out. I am new to php.
table.php
<?php
include 'nav.php';
$sql = 'SELECT * FROM owners';
$query = mysqli_query($con, $sql);
if (!$query) {
die ('SQL Error: ' . mysqli_error($con));
}
?>
<html>
<head>
<link rel = "stylesheet" type = "text/css" href = "css/style.css">
<style>
.data-table{
width: 1024px;
margin-left: 150px;
text-align:center;
border: 1px solid firebrick;
background-color: white;
}
td,th{
border: 1px solid firebrick; padding: 3px 2px 1px 1px;
}
</style>
</head>
<body>
<div class="container">
<article>
<table class="data-table">
<thead>
<tr>
<th>Restuarant Name</th>
<th>Location</th>
<th>Menu</th>
</tr>
<tr>
</tr>
</thead>
<tbody>
<?php
while ($row = mysqli_fetch_array($query)){
$_SESSION['resphone'] = $row['resphone'];
$_SESSION['restaur'] = $row['restaur'];
echo '<tr>
<td>'.$row['restaur'].'</td>
<td>'.$row['loc'].'</td>
<td style="background-color:firebrick;"><form method="post" action="openmenu.php?id=$row[restaur]"><input value="<?php echo $restaur;?>" type="hidden">
<input type="submit" value="View"></form></td>
</tr>';
}
?>
</tbody>
</table>
</form>
</article>
</div>
</body>
</html>
openmenu.php
<?php
include('nav.php');
?>
<html>
<head>
<link rel="stylesheet" href="css/style.css">
<style>
table, td {
border: none;
text-align: center;
text-align-last: center;
}
</style>
</head>
<body>
<div class="container">
<article>
<form method="get" align="center" action="" class="formwrap" enctype='multipart/form-data'>
<h1><?php $restaur = $_SESSION['restaur'];
echo $restaur ;?></h1>
<h1>Call to Order:</h1>
<?php $resphone = $_SESSION['resphone'];
echo $resphone;
?>
<br>
<br>
<?php
$sql = "select img from owners where restaur ='$restaur'";
$result = mysqli_query($con,$sql);
$row = mysqli_fetch_array($result);
$image_src2 = "upload/".$row['img'];
?>
<img src='<?php echo $image_src2; ?>' >
</form>
</article>
</div>
</body>
</html>

Issue 1
In this snippet you are setting the session variables resphone and restaur to the values of the store you are currently iterating over. Over and over again. That's why you're only ever getting the last store's information - it's the last things you set those variables to.
while ($row = mysqli_fetch_array($query)){
$_SESSION['resphone'] = $row['resphone'];
$_SESSION['restaur'] = $row['restaur'];
Issue 2
You should probably change the form method to get and discard the unused hidden input like so:
<form method="post" action="openmenu.php?id=<?=$row['restaur']?>">
<input type="submit" value="View">
</form>
Or more likely just change it a plain old a link:
View
Issue 3
You're completely ignoring store id requested in openmenu.php. You are using $_SESSION where you should be using $_REQUEST or $_GET. I'm not going to give an example of how you should do that. Instead, please refer to this answer before moving any further.

first you getting data from database & then use view button for openmenu.php but why u use this way
<form method="post" action="openmenu.php?id=$row[restaur]"><input value="<?php echo $restaur;?>" type="hidden"><input type="submit" value="View"></form>

query is not running in php

Hi there i am trying to create a screen in php.
in which i select scenario and the screen displayed accordingly.
but i am stuck in a simple problem that my simple select query is not working
which is
$deptQuery = "Select * from mcb_department";
echo mysql_real_escape_string($deptQuery);
mysql_query($deptQuery) or die("adfasdf");
in same code if change the table name it just work fine, also this table is created in the db as well with the same name i have shared.
here is my complete code.
<?php
include "include/conn.php";
include "include/session.php";
if(isset($_SESSION['logged_user']) && $_SESSION['logged_user'] != '99999'){
header('location: login.php');
}
$query = mysql_query("select curdate() as todayDate");
$show = mysql_fetch_array($query);
if(isset($show)){
$todayDate= $show['todayDate'];
}
$group[] = array();
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Untitled Document</title>
<meta Content="no-cache, no-store, must-revalidate" http-Equiv="Cache-Control" />
<meta Content="no-cache" http-Equiv="Pragma" />
<meta Content="0" http-Equiv="Expires" />
<link href="styles/style.css" type="text/css" rel="stylesheet" />
<link href="styles/popupstyle.css" type="text/css" rel="stylesheet" />
<link href="styles/ts.css" type="text/css" rel="stylesheet" />
<link href="styles/calendar.css" type="text/css" rel="stylesheet" />
<style>
table {
font-family: arial;
border-collapse: collapse;
width: 100%;
font-size: 11px;
}
td, th {
border: 1px solid #dddddd;
text-align: left;
padding: 3px;
}
tr:nth-child(even) {
background-color: #dddddd;
}
</style>
</head>
<body >
</body>
<select id='select_opt'>
<option> Select Assigment </option>
<option value="1"> assign quiz to all Employees </option>
<option value="2"> assign quiz to Sapcific Group </option>
<option value="3"> assign quiz to Sapcific Department </option>
<option value="4"> assign quiz to Sapcific Employee </option>
</select>
<!-- all Users -->
<div id='allUsers' style='margin-left:20px; margin-top: 20px; width: 50%; height:100px; display: none;' >
<form action="" mathod="post">
<select>
<option value=""> select Quiz</option>
</select>
<input type="submit" >
</form>
</div>
<!-- group -->
<div id='group' style='margin-left:20px; margin-top: 20px; width: 50%; height:100px; display: none;' >
<form action='group_assigment.php' mathod="post">
<table>
<tr>
<th>All <input type="checkbox"> </th>
<th>Group Name</th>
<th>Group Code</th>
</tr>
<?php
$group[] = array();
$groupQuery = "Select * from mcb_groups";
$query = mysql_query($groupQuery);
?>
<tr>
<?php if($query){
while($group = mysql_fetch_array($query)){
?>
<td><input type="checkbox" value="<?php echo $group['group_name']; ?>"></td>
<td><?php echo $group['group_name']; ?></td>
<td><?php echo $group['group_code']; ?></td>
</tr>
<?php }
} else{ echo "";} ?>
</table>
</form>
</div>
<!--
####################################
department
####################################
-->
<div id='Department' style='margin-left:20px; margin-top: 20px; width: 50%; height:100px; display: none;' >
<form action='group_assigment.php' mathod="post">
<table>
<tr>
<th>all <input type="checkbox"> </th>
<th>name</th>
<th>code</th>
<th>group</th>
</tr>
<tr>
<?php
$deptQuery = "Select * from mcb_department";
echo mysql_real_escape_string($deptQuery);
mysql_query($deptQuery);
?>
<td><input type="checkbox"></td>
<td>code</td>
<td>name</td>
<td>group</td>
</tr>
</table>
<input type="submit" >
</form>
</div>
<!--
####################################
Employee
####################################
-->
<div id='employee' style='margin-left:20px; margin-top: 20px; width: 50%; height:100px; display: none;' >
<form action="" mathod="post">
<label>employee id : </label><input type="text" >
<input type="submit" >
</form>
</div>
<script language="javascript" type="text/javascript">
var elem = document.getElementById("select_opt");
elem.onchange = function(){
console.log("yes i am running");
if( document.getElementById("select_opt").value == "1" ){
document.getElementById("allUsers").style.display = "Block";
document.getElementById("group").style.display = "none";
document.getElementById("Department").style.display = "none";
document.getElementById("employee").style.display = "none";
}
else if( document.getElementById("select_opt").value == "2" ){
document.getElementById("group").style.display = "Block";
document.getElementById("allUsers").style.display = "none";
document.getElementById("Department").style.display = "none";
document.getElementById("employee").style.display = "none";
}
else if( document.getElementById("select_opt").value == "3" ){
document.getElementById("Department").style.display = "block";
document.getElementById("group").style.display = "none";
document.getElementById("allUsers").style.display = "none";
document.getElementById("employee").style.display = "none";
}
else if( document.getElementById("select_opt").value == "4" ){
document.getElementById("employee").style.display = "block";
document.getElementById("Department").style.display = "none";
document.getElementById("group").style.display = "none";
document.getElementById("allUsers").style.display = "none";
}
else{
}
};
</script>
</
html>
regard,
Shafee jan

in same code if change the table name it just work fine
Then I would make sure you're connected to the right database. It's surprisingly common for developers to have multiple versions of their database, either on different MySQL instances or else on the same instance under a different schema name. Then they get mixed up, connecting to one database with MySQL Workbench while their app is connecting to a different database.
I would advise that you temporarily add a query to your page to run SHOW TABLES and then dump the result of that query to the log, to confirm that the mcb_department table is present in the database that your PHP script is connected to.
$deptQuery = "Select * from mcb_department";
echo mysql_real_escape_string($deptQuery);
mysql_query($deptQuery);
Where's your error checking? You need to check the return value of mysql_query() every time you run a query, so if there's a problem, you output the error message to your log. Only this way can you start to solve some of these problems.
$result = mysql_query($deptQuery);
if (!$result) {
trigger_error("Error in file " . __FILE__ . " near line " . __LINE__
. " for query $deptQuery: " . mysql_error());
die("Database error");
}
PS: The advice of some commenters that mysql_* functions are deprecated is true, but probably irrelevant to your question. Folks who focus on the API, when you have said the API is working, are just being pedantic.

Adding CSS class in form that posts to PHP breaks query

I am a beginner to coding... Something strange happens when I enter a CSS class to a form that posts data to same php file that executes mysqli query. Everything goes well until I add to the form. When I do this, I don't get an error, but browser reads: search.php?submitted=true&category=firstname&criteria=hassan&submitted=Submit. I also don't get any results back.
When I don't have the css class added, it works fine, url doesn't read the above and database results come back. Any help as to why this happens and what I can do to fix it?
Apologies in advance for strange way of adding css. Using purecss.io but import from yahoo cdn doesn't work, also uploading to server doesn't work. Only way I get it to work is by adding the css code directly into file.
<html>
<head>
<title>pageName</title>
<style type="text/css">
table {
background-color: #ADD8E6;
border: 1px solid black;
font-family: Arial; font-size: 14px;
}
th {
text-align: left;
}
.pure-form input[type=text],.pure-form input[type=password],.pure-form input[type=email],.pure-form input[type=url],.pure-form input[type=date],.pure-form input[type=month],.pure-form input[type=time],.pure-form input[type=datetime],.pure-form input[type=datetime-local],.pure-form input[type=week],.pure-form input[type=number],.pure-form input[type=search],.pure-form input[type=tel],.pure-form input[type=color],.pure-form select,.pure-form textarea{padding:.5em .6em;display:inline-block;border:1px solid #ccc;box-shadow:inset 0 1px 3px #ddd;border-radius:4px;vertical-align:middle;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.pure-form input:not([type]){padding:.5em .6em;display:inline-block;border:1px solid #ccc;box-shadow:inset 0 1px 3px #ddd;border-radius:4px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.pure-form input[type=color]{padding:.2em .5em}.pure-form input[type=text]:focus,.pure-form input[type=password]:focus,.pure-form input[type=email]:focus,.pure-form input[type=url]:focus,.pure-form input[type=date]:focus,.pure-form input[type=month]:focus,.pure-form input[type=time]:focus,.pure-form input[type=datetime]:focus,.pure-form input[type=datetime-local]:focus,.pure-form input[type=week]:focus,.pure-form input[type=number]:focus,.pure-form input[type=search]:focus,.pure-form input[type=tel]:focus,.pure-form input[type=color]:focus,.pure-form select:focus,.pure-form textarea:focus{outline:0;border-color:#129FEA}.pure-form input:not([type]):focus{outline:0;border-color:#129FEA}.pure-form input[type=file]:focus,.pure-form input[type=radio]:focus,.pure-form input[type=checkbox]:focus{outline:thin solid #129FEA;outline:1px auto #129FEA}.pure-form .pure-checkbox,.pure-form .pure-radio{margin:.5em 0;display:block}.pure-form input[type=text][disabled],.pure-form input[type=password][disabled],.pure-form input[type=email][disabled],.pure-form input[type=url][disabled],.pure-form input[type=date][disabled],.pure-form input[type=month][disabled],.pure-form input[type=time][disabled],.pure-form input[type=datetime][disabled],.pure-form input[type=datetime-local][disabled],.pure-form input[type=week][disabled],.pure-form input[type=number][disabled],.pure-form input[type=search][disabled],.pure-form input[type=tel][disabled],.pure-form input[type=color][disabled],.pure-form select[disabled],.pure-form textarea[disabled]{cursor:not-allowed;background-color:#eaeded;color:#cad2d3}.pure-form input:not([type])[disabled]{cursor:not-allowed;background-color:#eaeded;color:#cad2d3}.pure-form input[readonly],.pure-form select[readonly],.pure-form textarea[readonly]{background-color:#eee;color:#777;border-color:#ccc}.pure-form input:focus:invalid,.pure-form textarea:focus:invalid,.pure-form select:focus:invalid{color:#b94a48;border-color:#e9322d}.pure-form input[type=file]:focus:invalid:focus,.pure-form input[type=radio]:focus:invalid:focus,.pure-form input[type=checkbox]:focus:invalid:focus{outline-color:#e9322d}.pure-form select{height:2.25em;border:1px solid #ccc;background-color:#fff}.pure-form select[multiple]{height:auto}.pure-form label{margin:.5em 0 .2em}.pure-form fieldset{margin:0;padding:.35em 0 .75em;border:0}.pure-form legend{display:block;width:100%;padding:.3em 0;margin-bottom:.3em;color:#333;border-bottom:1px solid #e5e5e5}.pure-form-stacked input[type=text],.pure-form-stacked input[type=password],.pure-form-stacked input[type=email],.pure-form-stacked input[type=url],.pure-form-stacked input[type=date],.pure-form-stacked input[type=month],.pure-form-stacked input[type=time],.pure-form-stacked input[type=datetime],.pure-form-stacked input[type=datetime-local],.pure-form-stacked input[type=week],.pure-form-stacked input[type=number],.pure-form-stacked input[type=search],.pure-form-stacked input[type=tel],.pure-form-stacked input[type=color],.pure-form-stacked input[type=file],.pure-form-stacked select,.pure-form-stacked label,.pure-form-stacked textarea{display:block;margin:.25em 0}.pure-form-stacked input:not([type]){display:block;margin:.25em 0}.pure-form-aligned input,.pure-form-aligned textarea,.pure-form-aligned select,.pure-form-aligned .pure-help-inline,.pure-form-message-inline{display:inline-block;*display:inline;*zoom:1;vertical-align:middle}.pure-form-aligned textarea{vertical-align:top}.pure-form-aligned .pure-control-group{margin-bottom:.5em}.pure-form-aligned .pure-control-group label{text-align:right;display:inline-block;vertical-align:middle;width:10em;margin:0 1em 0 0}.pure-form-aligned .pure-controls{margin:1.5em 0 0 11em}.pure-form input.pure-input-rounded,.pure-form .pure-input-rounded{border-radius:2em;padding:.5em 1em}.pure-form .pure-group fieldset{margin-bottom:10px}.pure-form .pure-group input,.pure-form .pure-group textarea{display:block;padding:10px;margin:0 0 -1px;border-radius:0;position:relative;top:-1px}.pure-form .pure-group input:focus,.pure-form .pure-group textarea:focus{z-index:3}.pure-form .pure-group input:first-child,.pure-form .pure-group textarea:first-child{top:1px;border-radius:4px 4px 0 0;margin:0}.pure-form .pure-group input:first-child:last-child,.pure-form .pure-group textarea:first-child:last-child{top:1px;border-radius:4px;margin:0}.pure-form .pure-group input:last-child,.pure-form .pure-group textarea:last-child{top:-2px;border-radius:0 0 4px 4px;margin:0}.pure-form .pure-group button{margin:.35em 0}.pure-form .pure-input-1{width:100%}.pure-form .pure-input-2-3{width:66%}.pure-form .pure-input-1-2{width:50%}.pure-form .pure-input-1-3{width:33%}.pure-form .pure-input-1-4{width:25%}.pure-form .pure-help-inline,.pure-form-message-inline{display:inline-block;padding-left:.3em;color:#666;vertical-align:middle;font-size:.875em}.pure-form-message{display:block;color:#666;font-size:.875em}#media only screen and (max-width :480px){.pure-form button[type=submit]{margin:.7em 0 0}.pure-form input:not([type]),.pure-form input[type=text],.pure-form input[type=password],.pure-form input[type=email],.pure-form input[type=url],.pure-form input[type=date],.pure-form input[type=month],.pure-form input[type=time],.pure-form input[type=datetime],.pure-form input[type=datetime-local],.pure-form input[type=week],.pure-form input[type=number],.pure-form input[type=search],.pure-form input[type=tel],.pure-form input[type=color],.pure-form label{margin-bottom:.3em;display:block}.pure-group input:not([type]),.pure-group input[type=text],.pure-group input[type=password],.pure-group input[type=email],.pure-group input[type=url],.pure-group input[type=date],.pure-group input[type=month],.pure-group input[type=time],.pure-group input[type=datetime],.pure-group input[type=datetime-local],.pure-group input[type=week],.pure-group input[type=number],.pure-group input[type=search],.pure-group input[type=tel],.pure-group input[type=color]{margin-bottom:0}.pure-form-aligned .pure-control-group label{margin-bottom:.3em;text-align:left;display:block;width:100%}.pure-form-aligned .pure-controls{margin:1.5em 0 0}.pure-form .pure-help-inline,.pure-form-message-inline,.pure-form-message{display:block;font-size:.75em;padding:.2em 0 .8em}}
</style>
</head>
<body>
<h1>MEMBERS SEARCH</h1>
<form class="pure-form">
<form method="post" action="search.php">
<input type="hidden" name="submitted" value="true"/>
<label> Search Category:
<select name="category">
<option value="firstname">First NAME</option>
<option value="lastname">Last NAME</option>
</select>
</label>
<label> Search Criteria:<input type="text" name="criteria" /></label>
<input type="submit" name="submitted" />
</form>
<?php
if (isset($_POST['submitted'])){
// connect to the DB
include('connect.php');
$category = mysqli_real_escape_string($con, $_POST['category']);
$criteria = mysqli_real_escape_string($con, $_POST['criteria']);
$query = "SELECT * FROM Customers WHERE firstname LIKE '%" . $criteria ."%'";
$result = mysqli_query($con, $query);
$num_rows = mysqli_num_rows($result);
echo "$num_rows results found";
while ($row = mysqli_fetch_array($result, MYSQLI_ASSOC)) {
?>
<table>
<tr>
<td width="300" ><font face="Arial Black" size="2"><?php echo $row['firstname']?> <?php echo $row['lastname']?></font></td>
</tr>
</table>
<table>
<tr>
<td width="100"><b>Licence #</b></td>
<td width="3">:</td>
<td width="120"><?php echo $row['licencenr']?></td>
</tr>
<tr>
<td width="100"><b>Birthday</b></td>
<td width="3">:</td>
<td width="120"><?php echo $row['birth']?></td>
</tr>
<tr>
<td width="100"><b>Age</b></td>
<td width="3">:</td>
<td width="120"><?php echo $row['age']?></td>
</tr>
<td width="120"> </td>
</tr>
</table>
<br>
<?php
}
}
?>
</body>
</html>

I found the solution...
instead of adding
<form class="pure-form">
i deleted
<form class="pure-form">
and changed
<form method="post" action="search.php">
to
<form method="post" class="pure-form" action="search.php">

How to display images from mysql table after selection of a dropdown category from database?

I want to show a category based shopping items with images on web page that can be found in the most Online shopping sites.I crated two mysql tables: Ist with id, category_name and 2nd with id, categoryid, product, image_path. I am able to display all product images at a time on page, but I don't know how to show product images of a single category selected from a dropdown list with submit button at the top of the page. I hope my point is clear to all otherwise feel free to ask me.
Below I attached my code that shows all the product images on my php page at a time without any dropdown list. Any ideas and advice on doing this is welcome.
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<style type="text/css">
ul, li {
list-style-type:none;
}
ul.display {
width: 500px;
}
ul.display li {
float: left;
width: 100px;
height: 120px;
margin-left: 5px;
margin-right: 5px;
margin-bottom: 5px;
position: relative;
vertical-align:middle;
text-align:center;
}
ul.display li a img {
width: 94px;
height: 114px;
display: inline;
}
</style>
</head>
<body>
<div align="center">
<?php
include('connect.php');
$SQL = "SELECT * from becuart";
$result = mysql_query( $SQL );
echo "<ul class='display'>";
while( $row = mysql_fetch_array( $result ) ) {
$filepath = $row["path"];
echo "<li>";
echo "<img src=\"$filepath\" border=\"0\">";
echo "</li>";
}
echo "</ul>";
?>
</div>
</body>
</html>`

Because it's way too long -> new answer:
<?php
include 'dbconnect.php';
?>
<form name="product" method="post" action="">
<table align="right" width="10%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>Category</td>
<td>
<select name="category">
<?php
$sql = "SELECT id, art_name, path FROM category;";
$result = mysql_query($sql);
while ($row = mysql_fetch_assoc($result)) {
?>
<option value="<?= $row['id']; ?>"><?= $row['art_name']; ?></option>
<?php } ?>
</select>
</td>
</tr>
<tr>
<td> </td>
<td><input name="go" type="submit" value="Go" /></td>
</tr>
</table>
</form>
<div align="center">
<ul class='display'>
<?php
$id = (int)$_POST['category'];
$sql_search = "SELECT id, art_name, path FROM category WHERE id = $id";
$search = mysql_query($sql_search);
if (isset($_POST['go'])) {
while ($row = mysql_fetch_assoc($search)) {
?>
<li><img src="<?= $row['path']; ?>" border="0"></li>
<?php }
}
else {
}
?>
</div>

SELECT id, name, path FROM table;
...
<select name ...>
<?php
while( $row = mysql_fetch_array( $result ) ) {
?>
<option name="id" value="<?= $row['id']; ?>"><?= $row['name']; ?></option>
<?php
}
?>
</select>
So by javascript/jquery open the img which answers on the POSTed $row['id']; (SELECT path FROM table WHERE id = ?;) or by a simple $_POST['id'] which is the name of the field

PHP echo tables

Overview
I have some data stored in MySql database related to Products. I am trying to retrieve this data and display it on a page using HTML table.
The PHP and MySql has gone well and all the data is retrieved but it is displayed in a very messy manner.
Here is what I have as a layout:
What I am aiming to achieve is to further divide the results table add more columns rows to make the data more readable
Something like this;
The code: PHP, MySQL & HTML:
<?php
session_start();
include('connect_mysql.php');
$product_name = 'product_name';
$product_qua = 'product_qua';
$product_price = 'product_price';
$product_image = 'product_image';
$product_des = 'product_des';
$sql = mysql_query("SELECT * FROM products");
echo "<table id='display'>";
while($rows = mysql_fetch_array($sql))
{
echo"<br>";
echo"<tr><td>";
echo"$rows[$product_name]<br></td>";
echo"<td><img src=$rows[$product_image] height='200px' width='200px'><br></td>";
echo"<td>Avalible: $rows[$product_qua]<br></td>";
echo"<td>Price: $rows[$product_price]<br></td>";
echo"<td>Description: $rows[$product_des]<br></td>";
echo"</tr>";
}
echo "</table>";
?>
CSS responsible for this part:
#display{
float:left;
border: 5px solid black;
margin-left:100px;
}

just add some padding or a border to the table cells:
table#display td{
border: 1px solid black;
padding:0 8px;
}
Edit: What you could do as well:
<table id='display'>
<?php while($rows = mysql_fetch_array($sql)): ?>
<!-- <br> <- why a break? it's not in the correct spot anyway -->
<tr><td>
<?php echo $rows[$product_name]; ?><br>
</td>
<td> - </td>
<td><img src="<?php echo $rows[$product_image]; ?>" height='200px' width='200px'><br></td>
<td> - </td>
<td>Avalible: <?php echo $rows[$product_qua]; ?><br></td>
<td> - </td>
<td>Price: <?php echo $rows[$product_price]; ?><br></td>
<td> - </td>
<td>Description: <?php echo $rows[$product_des]; ?><br></td>
</tr>
<?php endwhile; ?>
</table>
Tip: I prefer to use the while/endwhile; approach rather than using brackets when displaying data to the user.

First of all don't echo so much HTML using PHP, instead do it like this
<?php
session_start();
include('connect_mysql.php');
$product_name = 'product_name';
$product_qua = 'product_qua';
$product_price = 'product_price';
$product_image = 'product_image';
$product_des = 'product_des';
$sql = mysql_query("SELECT * FROM products"); ?>
<table id='display'>
<?php
while($rows = mysql_fetch_array($sql)) {
?>
<tr><td><?php echo $rows[$product_name]; ?></td>
<!-- And so on-->
<?php
}
?>
</table>
Secondly by seeing your inmage, it seems like you need a border for your table so use
table, td {
border: 1px solid #000000;
}

add the following css to apply border on your table cells:
#display td{ border: 2px solid red; }
and optionally add to your #display { :
border-collapse: collapse;

Categories