background image in div doesn't show with PHP - php

I'm trying to give an div a background image that is attached to a specific post (zo everytime there is another image needed). I'm retrieving the URLS out of the database and then put it into the following code:
<div class="parallax_banner" style="background-image:url(<?= "_/".$rowImage['imgPath']."/".$rowImage['imgName'] ?>)"></div>
the whole code:
<?
$result = mysql_query("SELECT * FROM `items` WHERE `itemID` = ".$_GET['postID'])or die(mysql_error());
while ($row = mysql_fetch_assoc($result)) {
$resultImage = mysql_query("SELECT * FROM `images` WHERE `itemID` =".$row['itemID']." LIMIT 1")or die(mysql_error());
while ($rowImage = mysql_fetch_assoc($resultImage)) {
?>
<div class="paginaBannerWrapper">
<div class="paginaBannerSlideshow">
<div class="parallax_banner" style="background-image:url(<?= "_/".$rowImage['imgPath']."/".$rowImage['imgName'] ?>)"></div>
</div>
</div>
<div id="content">
<div id="bigTitle">
<h1><?=$row['itemTitle']?></h1>
</div>
<div id="centerContent">
<div id="colDesc">
<div class="itemContent"><?=$row['itemContent']?></div>
</div>
<div id="colImg"><img src="<?= "_/".$rowImage['imgPath']."/".$rowImage['imgName'] ?>"/></div>
<?
}
}
?>
</div>
</div>
It's doesn't show anything, but If I test the link with <img src= instead of background-image:url() it shows up. So the path is right. How to solve this?

If you are using background-* css settings you need to give the div some dimensions of height and width or it will default to none and you will not see your image.

Related

How can I display only certain images from my database that have the same ID and not just display all of them?

This image shows that I assigned different house_ID's for each image. Despite that, I would like to display images that have the same house_id, instead of just displaying all of them. For example, I would like to only display images with the house_id of 4. Does anyone know how to do this?
This is my current code which just displays all of them in a slide show.
<?php
// Include the database configuration file
include_once 'dbConfig.php';
// Get images from the database
$query = $db->query("SELECT * FROM images2 ORDER BY house_id DESC");
?>
<div class="frame">
<div class="slideshow-container">
<?php if($query->num_rows > 0){
while($row = $query->fetch_assoc()){
$imageURL = 'uploads2/'.$row["file_name"];?>
<div class="mySlides fade">
<img style="height: 200px;" src="<?php echo $imageURL; ?>">
</div><?php }?>
<a class="prev" onclick="plusSlides(-1)">❮</a>
<a class="next" onclick="plusSlides(1)">❯</a>
</div></div>

Reload DIV with new images

I have an employee database which includes images as well as their work location (specialty). I have created a page where I fill out a form and upload the image to a directory and the path to the database. I then load the main page where I pull in all the images from the database (into the "photos" DIV. Everything works fine.
What I would like to do is reload the images in the DIV based on a MySQL query from a button. For example, instead of showing all employees, I only want to see those who have a specific job function i.e. Management. I currently have this accomplished by redirecting to a new page, where I run a specific query and that works fine as well. However, I'd like to learn how this is done without creating a new page for each query. I've spent many days looking at AJAX and PHP tutorials, which I how I was able to accomplish what I have, but I can't find a method to do what I want. This is the relevant part of my code:
Main.php
<div class="container-fluid">
<div class="row">
<div class ="col-lg-12" style="width: 18%; height: 100%; border:3px solid red;">
MANAGEMENT
HIGH
</div>
<?php
include ('db_connect.php');
//include_once ('functions.php');
$result = $db->query("SELECT * from monctonfir order by initials ASC");
if($result->num_rows > 0){
while ($row = $result->fetch_assoc()){
$imageURL = 'image/'.$row["file"];
$initial = $row["initials"];
$name = $row["name"];
?>
<div id="photos" class = "col-lg-1 no-gutters" style="margin-top:1rem;">
<div class="card text-center" style="width: 5rem;">
<a href = "#">
<img class="img card-img-top" src = "<?php echo $imageURL ?>">
</a>
<div class = "card-body">
<h5 class = "card-title round-button" style="text-align: center;"><?php echo $initial ?></h5>
</div>
</div>
</div>
<?php }
} ?>
</div>
Can someone point me in the right direction?
Thanks!
You don't need jQuery for what you are doing. You can use query/GET parameters to build your sql so you don't have to create a different page. Like:
<div class="container-fluid">
<div class="row">
<div class ="col-lg-12" style="width: 18%; height: 100%; border:3px solid red;">
MANAGEMENT
HIGH
ALL
</div>
<?php
include ('db_connect.php');
//include_once ('functions.php');
$sql = "SELECT * from monctonfir WHERE 1 ";
if(isset($_GET['job'])) $sql .= " AND job = '".$_GET['job']."' ";
$sql .= " order by initials ASC";
$result = $db->query($sql);
if($result->num_rows > 0){
while ($row = $result->fetch_assoc()){
$imageURL = 'image/'.$row["file"];
$initial = $row["initials"];
$name = $row["name"];
?>
<div id="photos" class = "col-lg-1 no-gutters" style="margin-top:1rem;">
<div class="card text-center" style="width: 5rem;">
<a href = "#">
<img class="img card-img-top" src = "<?php echo $imageURL ?>">
</a>
<div class = "card-body">
<h5 class = "card-title round-button" style="text-align: center;"><?php echo $initial ?></h5>
</div>
</div>
</div>
<?php }
} ?>
</div>
The simplest way is to use the load function of Jquery
Jquery
For example:
$( "#divID" ).load( "loadEmploye.php", { parameters1: 25, parameters2:3 });

display images from database in horizontal way

hi this is my code which display images from mysql database
<?php
error_reporting(0);
include_once 'dbconfig.php';
$id=$_POST['id'];
$q="select * from services ";
$qq=mysql_query($q)
or die(mysql_error());
while($row=mysql_fetch_array($qq)){
$s1=$row[image];
?>
<?php
$p1="admin/services/uploads-services/";
echo '<img src="'.$p1.$s1.'" class="img-responsive" alt="Blog Image">'; ?>
<?php } ?>
it appears in vertical way but i want to make it appear in horizontal way
how can i do this ?
If you want images to be in same row, add display: inline-block to them.
.img-responsive {
display: inline-block;
}
Probably because you visualize the images not in a defined col. If you want to visualize 3 images at a line, you should have
<div class="col-md-12">
<div class="col-md-4">
put your image here
</div>
<div class="col-md-4">
put your image here
</div>
<div class="col-md-4">
put your image here
</div>

How to retrieve image from database and display image on the web page

I have inserted image into database and store name in the table.
my image is saved in a folder named 'Uploads'.
Now need to retrieve image from the databse and display it. when I try to display It only shows the image name which is taken from my table.but it does not show the image.
retrieving code is given below
$sql="SELECT * FROM candi_profile WHERE can_email='{$_SESSION['usr_email']}'";
$result=mysqli_query($con,$sql);
if(!$result) die(mysqli_error($con));
<div class="container">
<!-- Page Header -->
<div class="row">
<div class="col-lg-12">
<h1 class="page-header">Employer Dashboard
</h1>
</div>
</div>
<!-- /.row -->
<!-- Projects Row -->
<div class="row">
<div class="col-md-4">
<?php
while($rows=mysqli_fetch_array($result)){
$c_id = $rows['can_id'];
var_dump($c_id);
?>
<p class="lead"><?php echo $rows['can_name'] ?></p>
<div class="profile-sidebar">
<!-- SIDEBAR USERPIC -->
<div class="profile-userpic">
<p class="lead">
<?php echo $rows['pic_name'] ?></p>
</div>
<!-- END SIDEBAR USERPIC -->
<!-- SIDEBAR USER TITLE -->
<div class="profile-usertitle">
<div class="profile-usertitle-name">
Marcus Doe
</div>
<div class="profile-usertitle-job">
<?php echo $rows['can_city'] ?>
<i class="glyphicon glyphicon-map-marker">
</i>
</div>
<div class="profile-usertitle-job">
<i class="glyphicon glyphicon-envelope"></i>
<?php echo $rows['can_email'] ?>
</div>
<div class="profile-usertitle-job">
<?php echo $rows['can_country'] ?>
</div>
</div>
<!-- END SIDEBAR USER TITLE -->
<!-- SIDEBAR BUTTONS -->
<div class="profile-userbuttons">
<hr>
</div>
<!-- END SIDEBAR BUTTONS -->
<!-- SIDEBAR MENU -->
<?php
}
?>
</div>
you can use this code to retrieve image from database
<?php
include 'connection.php'
?>
<?php
$result = mysql_query("SELECT * FROM table") or die(mysql_error());
?>
<table border="1" cellpadding="5" cellspacing="5">
<tr> <th>Image</th></tr>
<?php
while($row = mysql_fetch_array($result)) {
$id = $row['id'];
?>
<tr>
<td><img src="uploads/<?php echo $row['pic_name'];?>" alt=" " height="75" width="75"></td>
</tr>
<?php
}
}
?>
</table>
I assume that the content of $rows['pic_name'] is string only as said on your question.
Put an image attribute and call the path of the image with the corresponding filename save on the database.
<img src = "<path>/<?php echo $rows['pic_name'] ?>" />
NOTE:
Make sure the image is existing on your desire path.
Use image tag to display the image and give it path to the image folder
<img src="your path/<?php echo $rows['pic_name'] ?>" />
friend instead of making images folder you should make a new image column(i.e "imageColumn ") type as blob then
You need to create another php script to return the image data, e.g. getImage.php.
home.php(or display image page) code
<body>
<img src="getImage.php?id=1" width="175" height="200" />
</body>
Then getImage.php is
<?php
$id = $_GET['id'];
// do some validation here to ensure id is safe
$link = mysql_connect("localhost", "root", "");
mysql_select_db("dvddb");
$sql = "SELECT imageColumn FROM Tablename WHERE id=$id";
$result = mysql_query("$sql");
$row = mysql_fetch_assoc($result);
mysql_close($link);
header("Content-type: image/jpeg");
echo $row['imageColumn '];
?>
First fetch image from database using query
The imagejpeg() function is an inbuilt function in PHP which is used to display image to browser or file.
Get data using function ob_get_contents();
Display image in page with height and width
$id = $_GET['id'];
$sql = "select image from table where id='".$id."'";
$res = mysqli_query($sql);
$row = mysqli_fetch_assoc($res);
$image = $row['image'];
ob_start();
imagejpeg($image, null, 50);
$data = ob_get_contents();
ob_end_clean();
echo "<img src='data:image/jpg;base64,'".base64_encode($data)."' style='border:1px
black; border-radius:10px; width:100px; height:125px;'>";

Display video (by url) and all the information about it from database using single loop

Basically, I have vid table in my db with this columns - urlv, textacv,decribacv, languagev,levelv and I need to display all videos that are in database (using url - urlv) and along with video I want to display the name(textacv) and description(decribacv) and some tags(languagev,levelv) of each video.
Currentely what I have achieved is I have a page where all my videos are displayed from database by url. Here how I've made this:
$conn = mysqli_connect('localhost','root','','people');
$query = "SELECT urlv, languagev,
levelv, textacv, decribacv FROM vid";
$fetch = mysqli_query($conn,$query);
$videos = array();
while ($row = mysqli_fetch_assoc($fetch)) {
$videos[] = $row['urlv'];
$language[] = $row['languagev'];
$levelv[] = $row['levelv'];
$textac[] = $row['textacv'];
$decribac[] = $row['decribacv'];
}
foreach ($videos as $urlv) {
echo "<div class='wrap'>
<div class='video-wrap'>
<div class='blockvidname'>
<div class='name'><legend class='name-top'>".
$textac."</legend></div>
<video class='video'controls>
<source src='".$urlv."'>
</video>
<div class='name-bot'><legend class='name-bottom'>
This is the name of the video</legend></div>
</div>
<div class='side-bar-wrap'> dfdfdf </div>
<button class='side-bar- button'>More Info</button>
</div>
</div>";
}
As you can see - I've used foreach loop to retrieve url from database and display videos, now I need to 'attach' name, description and some tags to each video acordinaly from my table vid. Here's what I did:
while ($row = mysqli_fetch_assoc($fetch)) {
$videos[] = $row['urlv'];
$language[] = $row['languagev'];
$levelv[] = $row['levelv'];
$textac[] = $row['textacv'];
$decribac[] = $row['decribacv'];
}
while($row) {
echo "<div class='wrap'>
<div class='video-wrap'>
<div class='blockvidname'>
<div class='name'><legend class='name-top'>".
$textac."</legend></div>
<video class='video'controls>
<source src='".$urlv."'>
</video>
<div class='name-bot'><legend class='name-bottom'>
This is the name of the video</legend></div>
</div>
<div class='side-bar-wrap'> dfdfdf </div>
<button class='side-bar-button'>More Info</button>
</div>
</div>";
}
But it doesnt display anything at all! I googled 'multiple arguments in foreach loop' but found nothing that could help me.
The problem is - cant display multiple data in single loop (because I have nestings in my html structure and multiple loops would brake it) from my db. Note: I want ALL videos that are in table to be displayed and each name, descriptiob etc. I want to attach to each video accordinally to db.
Thanks a lot! I'm really stuck on this thing. Thanks in advance.
You're kind of over complicating things by trying to put columns into their own arrays. It's manageable, but not necessary. Just doing everything in the initial while loop.
while ($row = mysqli_fetch_assoc($fetch)) { ?>
<div class='wrap'>
<div class='video-wrap'>
<div class='blockvidname'>
<div class='name'>
<legend class='name-top'><?php echo $row['textacv'] ?></legend>
</div>
<video class='video' controls>
<source src="<?php echo $row['urlv']?>">
</video>
<div class='name-bot'>
<legend class='name-bottom'>
This is the name of the video
</legend>
</div>
</div>
<div class='side-bar-wrap'> dfdfdf </div>
<button class='side-bar-button'>More Info</button>
</div>
</div>
<?php } ?>
Then just use the index of the row when echo'ing. Should be pretty straight forward from here.
You can use function each() to iterate over other arrays along with array $videos.
Try this code:
$conn = mysqli_connect('localhost','root','','people');
$query = "SELECT urlv, languagev,
levelv, textacv, decribacv FROM vid";
$fetch = mysqli_query($conn,$query);
$videos = array();
while ($row = mysqli_fetch_assoc($fetch)) {
$videos[] = $row['urlv'];
$language[] = $row['languagev'];
$levelv[] = $row['levelv'];
$textac[] = $row['textacv'];
$decribac[] = $row['decribacv'];
}
foreach ($videos as $urlv) {
$textacValue = each($textac);
$languageValue = each($language);
$levelvValue = each($levelv);
$decribacValue = each($decribac);
echo "<div class='wrap'>
<div class='video-wrap'>
<div class='blockvidname'>
<div class='name'><legend class='name-top'>".
$textacValue."</legend></div>
<video class='video'controls>
<source src='".$urlv."'>
</video>
<div class='name-bot'><legend class='name-bottom'>
This is the name of the video</legend></div>
</div>
<div class='side-bar-wrap'> dfdfdf </div>
<button class='side-bar- button'>More Info</button>
</div>
</div>";
}

Categories