Connecting images from SQL - php

Every time I try and load the page below the images do not show. I have the image names in an SQL database and also have the image folder in the same path as my index.php.
<div class="container-fluid">
<div class="col-md-12">
<div class="row">
<div class="col-md-6">
<h2 class="text-center">Products</h2>
<?php
$query = "SELECT * FROM product";
$result = mysqli_query($connect,$query);
while ($row = mysqli_fetch_array($result)) {?>
<form method="get" action="index.php?id=<?= $row['id'] ?>">
<img src="img/<?= $row['image'] ?>" style='height: 150px;'>
<h2><?= $row['name']; ?></h2>
<h2><?= $row['price']; ?></h2>
</form>
<?php }
?>
</div>
<div class="col-md-6">
<h2 class="text-center">Shopping Cart</h2>
</div>
</div>
</div>
</div>
</body>
</html>

I tried this code on my computer and the image appears perfectly.
Perhaps, you forgot to place a connection query.
<div class="container-fluid">
<div class="col-md-12">
<div class="row">
<div class="col-md-6">
<h2 class="text-center">Products</h2>
<?php
$connect = mysqli_connect('localhost','root','','test');
$query = "SELECT * FROM product";
$result = mysqli_query($connect,$query);
while ($row = mysqli_fetch_array($result)) {?>
<form method="get" action="index.php?id=<?= $row['id'] ?>">
<img src="img/<?= $row['image'] ?>" style='height: 150px;'>
<h2><?= $row['name']; ?></h2>
<h2><?= $row['price']; ?></h2>
</form>
<?php }
?>
</div>
<div class="col-md-6">
<h2 class="text-center">Shopping Cart</h2>
</div>
</div>
</div>
</div>

Related

Add product from database in PHP SQL and show using Bootstrap grid system

I am trying to add products dynamically from SQL database and using Bootstrap here but it shows my product on next line even if I am not using row the same result shown.
Here is my code and output.
include ("connection.php");
$sql = "select * from products";
$result = mysqli_query($con,$sql);
while ($row = $result->fetch_assoc())
{
?>
<div class="container">
<div class="row">
<div class="col-lg-12">
<div class="card" style="width: 18rem;">
<img src="<?php echo $row['Pimage'] ?>" class="card-img-top" alt="...">
<div class="card-body">
<h5 class="card-title"><?php echo $row['Pname'] ?></h5>
<p class="card-text"><?php echo $row['Pdesc'] ?></p>
<P><?php echo $row['Pprice'] ?>PKR</P>
ADD To Cart
</div>
</div>
</div>
</div>
</div>
<?php
}
?>
You should do something like this
<div class="container">
<div class="row">
<?php
include ("connection.php");
$sql = "select * from products";
$result = mysqli_query($con,$sql);
while ($row = $result->fetch_assoc()){
?>
<div class="col-lg-3">
<div class="card" style="width: 18rem;">
<img src="<?php echo $row['Pimage'] ?>" class="card-img-top" alt="...">
<div class="card-body">
<h5 class="card-title"><?php echo $row['Pname'] ?></h5>
<p class="card-text"><?php echo $row['Pdesc'] ?></p>
<P><?php echo $row['Pprice'] ?>PKR</P>
ADD To Cart
</div>
</div>
</div>
<?php
}
?>
</div>
In that way you will have 4 columns of products

how to fetch database records as <div>s without changing fixed <div>s in left and right side?

layout image:
I want to design bootstrap div layout as shown in this picture. I need to have to banner advertisement in the left and right corner. In the middle, I need to have dynamic div s which fetch data from database using PHP. But in the middle when I fetch data as dynamic divs, when number of records increases, the second banner advertisement goes down. How can I solve this?
<div class="col-lg-2" style="padding-top: 50px;">
<div class="card" >
<img src="img/cement_Ad.jpg" height="500" width="300">
</div>
</div>
<!-- 2 -->
<div class="col-lg-8" style="padding-left: 250px;">
<!-- 4 -->
<?php
$sql="select * from services ";
$result = $con->query($sql);
if ($result->num_rows > 0) {
?>
<?php
while($row = $result->fetch_assoc()) {
?>
<div class="col-lg-3" style="padding-top: 40px; padding-left: 20px;">
<section>
<div class="well" >
<div class="card" >
<div class="row ">
<div class="col-md-4">
<img src="img/img1.jpg" height="150px" width="120px">
</div>
<div class="col-md-8 px-3">
<div class="card-block px-3">
<h4 class="card-title"><?php echo $row ['name']; ?></h4>
<div >
<label>Email</label>
<?php echo $row ['email']; ?>
</div>
<div >
<label>Address</label>
<?php echo $row ['address']; ?>
</div>
<div >
<label>District</label>
<?php echo $row ['district']; ?>
</div>
<div >
<label>City</label>
<?php echo $row ['city']; ?>
</div>
<div >
<label>Service</label>
<?php echo $row ['service']; ?>
</div>
<div >
<label>Years of Experience</label>
<?php echo $row ['years']; ?>
</div>
<div>
<label>Details</label>
<?php echo $row ['details']; ?>
</div>
Read More
</div>
</div>
</div>
</div>
</div>
</div>
</section>
</div>
<?php
}
} else {
echo "0 results";
}
$con->close();
?>
</div>
<div class="col-lg-2" style="padding-top: 50px; ">
<div class="card" >
<img src="img/pipe_Ad.jpg" height="500" width="300">
</div>
</div>
This is the result after I used Mr.E-Azam's answer given below
Check Below-
<div class="col-lg-2" style="padding-top: 50px;">
<div class="card" >
<img src="img/cement_Ad.jpg" height="500" width="300">
</div>
</div>
<!-- 2 -->
<div class="col-lg-8">
<!-- 4 -->
<?php
$sql="select * from services ";
$result = $con->query($sql);
if ($result->num_rows > 0) {
?>
<?php
while($row = $result->fetch_assoc()) {
?>
<div class="col-lg-3" style="padding-top: 40px;">
<section>
<div class="well" >
<div class="card" >
<div class="row ">
<div class="col-md-4">
<img src="img/img1.jpg" height="150px" width="120px">
</div>
<div class="col-md-8 px-3">
<div class="card-block px-3">
<h4 class="card-title"><?php echo $row ['name']; ?></h4>
<div >
<label>Email</label>
<?php echo $row ['email']; ?>
</div>
<div >
<label>Address</label>
<?php echo $row ['address']; ?>
</div>
<div >
<label>District</label>
<?php echo $row ['district']; ?>
</div>
<div >
<label>City</label>
<?php echo $row ['city']; ?>
</div>
<div >
<label>Service</label>
<?php echo $row ['service']; ?>
</div>
<div >
<label>Years of Experience</label>
<?php echo $row ['years']; ?>
</div>
<div>
<label>Details</label>
<?php echo $row ['details']; ?>
</div>
Read More
</div>
</div>
</div>
</div>
</div>
</section>
</div>
<?php
}
} else {
echo "0 results";
}
$con->close();
?>
</div>
<div class="col-lg-2" style="padding-top: 50px; ">
<div class="card" >
<img src="img/pipe_Ad.jpg" height="500" width="300">
</div>
</div>
I could solve the problem just by changing col-lg sizes. The answer is given below
<div class="col-lg-12">
<div class="col-lg-2" >
<div class="card" >
<img src="img/cement_Ad.jpg" height="500" width="300">
</div>
</div>
<div class="col-lg-8">
<?php
$sql="select * from services ";
$result = $con->query($sql);
if ($result->num_rows > 0) {
?>
<?php
while($row = $result->fetch_assoc()) {
?>
<div class="col-lg-6" style="padding-top: 20px;">
<section>
<div class="well" >
<div class="card" >
<div class="row ">
<div class="col-md-4">
<img src="img/img1.jpg" height="150px" width="120px">
</div>
<div class="col-md-8 px-3">
<div class="card-block px-3">
<h4 class="card-title"><?php echo $row ['name']; ?></h4>
<div >
<label>Email</label>
<?php echo $row ['email']; ?>
</div>
<div >
<label>Address</label>
<?php echo $row ['address']; ?>
</div>
<div >
<label>District</label>
<?php echo $row ['district']; ?>
</div>
<div >
<label>City</label>
<?php echo $row ['city']; ?>
</div>
<div >
<label>Service</label>
<?php echo $row ['service']; ?>
</div>
<div >
<label>Years of Experience</label>
<?php echo $row ['years']; ?>
</div>
<div>
<label>Details</label>
<?php echo $row ['details']; ?>
</div>
Read More
</div>
</div>
</div>
</div>
</section>
</div>
<?php
}
} else {
echo "0 results";
}
$con->close();
?>
</div>
<div class="col-lg-2" >
<div class="card" >
<img src="img/pipe_Ad.jpg" height="500" width="300">
</div>
</div>
</div>

PHP SUM total in the database

Hi I am new in PHP but I want to Sum my amount and display it on the page currently I am doing like this but it is not showing.
<div class="col-md-4 col-lg-4">
<div class="panel panel-bordered panel-black">
<div class="panel-heading">
<h3 class="panel-title"><?php echo translate('Total Amount ');?></h3>
</div>
<div class="panel-body">
<div class="text-center">
<h1>
<?php
echo $this->db->select('SUM(amount) as Total');
$getData = $this->db->get_where('tablename',array('amount = '!=0))->first_row();
echo $getData->Total;
?>
</h1>
</div>
</div>
</div>
</div>
try this
<?php
$data = $this->db->get_where('tablename',array('amount = '=>1))->sum(amount)->result();
foreach($data as $row):
echo $row['amount']; //if array output
echo $row->amount; //object output
endforeach;
?>
<div class="col-md-4 col-lg-4">
<div class="panel panel-bordered panel-black">
<div class="panel-heading">
<h3 class="panel-title"><?php echo translate('Total Amount ');?></h3>
</div>
<div class="panel-body">
<div class="text-center">
<h1>
<?php
echo $this->db->select('SUM(amount) as Total');
$getData = $this->db->get_where('tablename',array('amount = '!=0))->first_row();
echo $getData->Total;
?>
</h1>
</div>
</div>
</div>
</div>

How to print out mySQL database into a div table?

Grades table is this:
username assignment weight mark
a a1 10% 50%
b a1 10% 60%
How would I print this out using php/html?
<div class="a">
<div class="divTableHeading">
<div class="divTableRow">
<div class="divTableHead">Username</div>
<div class="divTableHead">assignment</div>
<div class="divTableHead">weight</div>
<div class="divTableHead">mark</div>
</div>
</div>
<div class="divTableBody">
<?php
include("config.php");
$sql = "SELECT username, assignment, weight, mark FROM grades";
$result = mysqli_query($db,$sql);
while($row = $result->fetch_assoc()) {
?>
<div class="divTableRow">
<div class="divTableCell">$row['username']</div>
<div class="divTableCell">$row['assignment']</div>
<div class="divTableCell">$row['weight']</div>
<div class="divTableCell">$row['mark']</div>
</div>
</div>
</div>
$db is the connected database that is from config.php. How would I keep looping through and output the grades table?
accidental edit
You're missing to echo your record values.
From just $row['username'] changed to <?php echo $row['username']; ?>
And you missed } to close your while loop. Closed it as well with - <?php } ?>
Updated code:
<div class="divTable blueTable">
<div class="divTableHeading">
<div class="divTableRow">
<div class="divTableHead">Username</div>
<div class="divTableHead">assignment</div>
<div class="divTableHead">weight</div>
<div class="divTableHead">mark</div>
</div>
</div>
<div class="divTableBody">
<?php
include("config.php");
$sql = "SELECT username, assignment, weight, mark FROM grades";
$result = mysqli_query($db,$sql);
while($row = $result->fetch_assoc()) {
?>
<div class="divTableRow">
<div class="divTableCell"><?php echo $row['username']; ?></div>
<div class="divTableCell"><?php echo $row['assignment']; ?>/div>
<div class="divTableCell"><?php echo $row['weight']; ?></div>
<div class="divTableCell"><?php echo $row['mark']; ?></div>
</div>
<?php } ?>
</div>
</div>
Don't forget to output your values
<?php echo $row['username']; ?>

Horizontal looping mysql inside div tag

Can someone help me to make content looping similiar with this website?
I tried to use while() construct and it was looping vertically. It appears without using table and I assume that this page is using thumbnail.
What I really need is the items will loop every 3 items and this is the code that I wrote and appears vertically.
<div class="container">
<?php
include "config/database.php";
$sql = "SELECT * FROM anidata";
$query = mysql_query($sql);
if ($query > 0) {
?>
<div class="col-sm-6 col-md-4" style="float: left;">
<?php
while($row = mysql_fetch_array($query)){
$image = $row['image'];
$title = $row['title'];
$genre = $row['genre'];
$start = $row['start'];
$schedule = $row['schedule'];
$description = $row['description'];
?>
<div class="row">
<div class="thumbnail" >
<div>
<img src="admin/<?php echo $row['image']; ?>" width="194" height="272">
</div>
<div class="caption">
<span id="teks" style="font-size:18px;"><?php echo $title; ?></span>
<div class="line-title">
</div>
<div class="description">
<span style="font-size:12px;"><?php echo $description; ?></span>
</div>
<div class="genre">
<span><?php echo $genre; ?></span>
</div>
</div>
</div>
<?php } ?>
</div>
<?php } ?>
</div>
Try this. If .thumbnail already have float:left; in your css you can remove the style attr.
<div class="container">
<?php
include "config/database.php";
$sql = "SELECT * FROM anidata";
$query = mysql_query($sql);
if ($query > 0) {
?>
<div class="col-sm-6 col-md-4" style="float: left;">
<div class="row">
<?php
while($row = mysql_fetch_array($query)){
$image = $row['image'];
$title = $row['title'];
$genre = $row['genre'];
$start = $row['start'];
$schedule = $row['schedule'];
$description = $row['description'];
?>
<div class="thumbnail" style="float:left;">
<div>
<img src="admin/<?php echo $row['image']; ?>" width="194" height="272">
</div>
<div class="caption">
<span id="teks" style="font-size:18px;"><?php echo $title; ?></span>
<div class="line-title">
</div>
<div class="description">
<span style="font-size:12px;"><?php echo $description; ?></span>
</div>
<div class="genre">
<span><?php echo $genre; ?></span>
</div>
</div>
</div>
<?php } ?>
</div>
<?php } ?>
</div>

Categories