By compiling this, display three image get my database and show it, when i click each image popup window show last image of my database.I want to know how to display the particular image, when i click first image,then popup window show first image and description, as well as same way second and third image. check to array loop in this code...
enter code here
<?php
$sql=mysql_query("select * from product_reg")or die(mysql_error());
while($row=mysql_fetch_array($sql))
{
$productname=$row['productname'];
$productid=$row['productid'];
$description=$row['description'];
$image=$row['image'];
$firstN = array();
$i=0;
$firstN = '<img src="'.$row ['image'].'">';
echo ' <a href="#" class="big-link" data-reveal-id="myModal" name="image" style="float:left;margin:100px 0 100px 100px;"> ' ; echo $productname;echo $firstN[$i];
$r=$firstN[$i];
echo '</a>';
$i++;
}
?>
<div id="myModal" class="reveal-modal">
<form>
<table>
<tr><td><?php echo $r; ?></td>
<td><h1>Reveal Modal Goodness</h1>
<p>This is a default modal in all its glory, but any of the styles here can easily be changed in the CSS.</p></td>
<a class="close-reveal-modal">×</a>
</div>
</body>
</html>
I guess you have the images stored in the database like BLOB data. If so you need to create a handler to retrieve those images and render them as image/[mime]...
So in short.
In your code you need to create a new file iz get_image.php in it you need to make a request to the server and retrieve the image so you can send it to the client.
In your code you need to change the image path to the handler path with some query parameters.
$firstN = '<img src="get_image.php?imageid='.$row ['productid'].'">';
There are a lot information how to render the image to the client from the internet.
may be you have to declare your $firstN = array(); and then incrementor $i=0; out of while loop and put in array like this:
$firstN[$i] = '<img src="'.$row['image'].'">';
below is the full code:
<?php
$sql=mysql_query("select * from product_reg")or die(mysql_error());
$firstN = array();
$i=0;
while($row=mysql_fetch_array($sql))
{
$productname=$row['productname'];
$productid=$row['productid'];
$description=$row['description'];
$image=$row['image'];
$firstN[$i] = '<img src="'.$row['image'].'">';
echo '<a href="#" class="big-link" data-reveal-id="myModal" name="image" style="float:left;margin:100px 0 100px 100px;"> ';
echo $productname;
echo $firstN[$i];
$r=$firstN[$i];
echo '</a>';
$i++;
}
?>
Updates:
You have a space here:
$firstN[$i] = '<img src="'.$row['image'].'">';
//-----------------------------^----here at this code block;
To get the last image , you need to modify your query to have SORT BY productid DESC
To display the images
echo "<a href='xxx.php?imgid=$image'><img src='yourimagesfolderpath/$image.jpg'> </a>";
to navigate in the images , you have to use JQUERY
Related
a bit of a weird one, but I have figured out how to use glob to display a list of images, and now I want to add a button under each image that would let you delete each image individually, I think I just need to use unlink, but whenever I try it just seems to delete every file on the server!:')
Here is the code I have so far:
<?php
// This sets the variable $filelist, and get it to search the specificied levels of wildcards for jpg, png, JPG, and PNG using glob:
$filelist = glob('{*.jpg,*/*.jpg,*/*/*.jpg,*/*/*/*.jpg,*/*/*/*/*.jpg,*/*/*/*/*/*.jpg,*.png,*/*.png,*/*/*.png,*/*/*/*.png,*/*/*/*/*.png,*/*/*/*/*/*.png,*.JPG,*/*.JPG,*/*/*.JPG,*/*/*/*.JPG,*/*/*/*/*.JPG,*/*/*/*/*/*.jpg,*.PNG,*/*.PNG,*/*/*.PNG,*/*/*/*.PNG,*/*/*/*/*.PNG,*/*/*/*/*/*.PNG}', GLOB_BRACE);
// This filters the above into date order from newest to oldest:
usort($filelist, create_function('$a,$b', 'return filemtime($b) - filemtime($a);'));
// This is how I now output the data, basically looks for each value of $filelist and sets it as $link, then outputs this and concatenates it with itself as a href and a background-image:
echo '<div class="thumbnail-grid">';
if($filelist){
foreach($filelist as $link){
echo '<div class="tile-container">';
echo '<a style="background-image: url('.$link.');" class="photo-link" href="'.$link.'"><i class="fas fa-link"></i></a>';
// This adds in a delete button:
echo '<form method="post"><input style="cursor: pointer;" name="delete" type="submit" value="DELETE"></form> ';
echo '</div>';
// This is the script that should be doing the unlinking:
if(isset($_POST['delete']))
{
unlink($link);
}
}
}else{
echo ' No images found.';
}
echo '</div>';
Hope this all makes sense/isn't asking too much!
Many thanks, Jack.
This isn't very secure as anyone can send a POST variable with a filename and delete it.
But as an example, you can loop through the files and give the delete button a value of the filename and then when you check for the posted delete button delete the file.
// This is the script that should be doing the unlinking:
if(isset($_POST['delete'])){
unlink($_POST['delete']);
}
if($filelist){
foreach($filelist as $link){
echo '<div class="tile-container">';
echo '<a style="background-image: url('.$link.');" class="photo-link" href="'.$link.'"><i class="fas fa-link"></i></a>';
echo '<form method="post">
<input style="cursor: pointer;" name="delete" type="submit" value="'.$link.'">
</form> ';
echo '</div>';
}
}else{
echo ' No images found.';
}
Hey I've recently been making a website and want to display the data from my database in a grid format opposed to it just listing down the page.
Here is my code right now:
<p>
<a href="pokemondetails.php?dex=<?php echo $row['dex'];?>">
<?php echo $row['name']; ?>
<br>
<img src="assets/<?php echo $row['dex']?>.png">
</a>
</p>
I was wondering how I would go about creating a for loop to allow the data from this database in conjunction with the image to span across the page with 7 columns and however many rows down until it reaches the end of the database.
Thanks!
<?php
$query = "Select * from tablename";
$bind = $conn->query($query);
if ($bind->num_rows > 0){
while ($row = $bind->fetch_assoc()){
?>
<p>
<a href="pokemondetails.php?dex=<?php echo $row['dex'];?>">
<?php echo $row['name']; ?>
<br>
<img src="assets/<?php echo $row['dex']?>.png">
</a>
</p>
<?php
}
}
?>
Try this, I just add while loop until End Of file (EOF table)
That's a simple script to adult content site I'd make with pieces of another codes. I am not a expertin PHP! I just can understand the basic.
<html>
<body>
<div align="center">
<div align="center" id="box">
<div align="center" id="carrosel">
<?php
$quantidade = 64;
$pagina = (isset($_GET['pagina'])) ? (int)$_GET['pagina'] : 1;
$inicio = ($quantidade * $pagina) - $quantidade;
$sql = "SELECT * FROM teen ORDER BY RAND() ASC LIMIT $inicio, $quantidade";
$qr = mysql_query($sql) or die(mysql_error());
while($ln = mysql_fetch_assoc($qr)){
?>
So, my problem is here. In that way, when you click the thumb, the browser will open that url that is out my site. the idea is to embed the video on a new iframe page. Someone can help me?
<a href="<?php echo $ln['url_video'];?>"target="_blank">
<img src="<?php echo $ln['thumb_video'];?>" /></a>
<?php
}
?>
<div align="center">
<?php
$sqlTotal = "SELECT thumb FROM teen";
$qrTotal = mysql_query($sqlTotal) or die(mysql_error());
$numTotal = mysql_num_rows($qrTotal);
$totalPagina= ceil($numTotal/$quantidade);
for($i = 1; $i <= $totalPagina; $i++){
if($i == $pagina)
echo $i;
else
echo "$i ";
}
?>
</div><br><br>
</body>
</html>
_blank : Opens the linked document in a new window or tab
_self : Opens the linked document in the same frame as it was clicked (this is default)
_parent : Opens the linked document in the parent frame
_top : Opens the linked document in the full body of the window
Or you can use iframe .or embed some players to play the video in the same area.
Use echo to print your links
while($ln = mysql_fetch_assoc($qr)){
echo '<a href='.$ln['url_video'].'target="_blank">',
'<img src='.$ln['thumb_video'].'/></a>';
}
And I found one more thing replace your echo "$i "; with this:
echo '$i';
And one more thing, use mysqli instead of mysql
You can also use window.open function, it will open the video in a new popup,
<a href="Javascript:;" onclick="window.open('<?php echo $ln['url_video'];?>',
'View Video')" ><img src="<?php echo $ln['thumb_video'];?>" /></a>
More details for window.open at http://www.w3schools.com/jsref/met_win_open.asp
I am doing gallery and I need some help. I have uploaded images to database through website - they are stored in MySQL (names) and in folder called images. What I want is to display (miniatures) them in line and on click enlarge them.
What my code does is displaying miniatures and links them to nothing :/ ...
This is my code:
<?php
$hostname_connect= "localhost";
$database_connect= "gallery";
$username_connect= "root";
$password_connect= "root";
$connect_solning = mysql_connect($hostname_connect, $username_connect, $password_connect) or trigger_error(mysql_error(),E_USER_ERROR);
#mysql_select_db($database_connect) or die (mysql_error());
$query_image = "SELECT * FROM gallery_images";
$result = mysql_query($query_image);
if(mysql_num_rows($result) > 0)
{
while($row = mysql_fetch_array($result))
{
?>
<a href = "javascript:void(0)" onclick = "document.getElementById('light').style.display='block';document.getElementById('fade').style.display='block'">
<?php
echo '<img alt="gallery" src="images/'.$row["image"].'" class="pic-resize" alt=""></a>';
}
while($row = mysql_fetch_array($result))
{
?>
<div id="light" class="white_content">
<?php
echo '<img alt="gallery" src="images/'.$row["image"].'" class="" alt=""></a>';
?>
Close
</div>
<?php
}
}
else
{
echo 'File name not found in database';
}
?>
You are using this in a loop:
<div id="light" class="white_content">
So you will have multiple elements with the same ID and that is not allowed.
Then you try to access them like:
document.getElementById('light')
Which will give you the first element it finds and not the actual one you want to enlarge (unless it is the first...).
Personally I would use the standard lightbox solution, link your thumbnail to your big image (instead of javascript:void(0)) and use the href attribute of your link to set the source for the big image using javascript when the thumbnail gets clicked.
Edit: An example for the html to get you started:
<?php
while($row = mysql_fetch_array($result))
{
?>
<a href="<?php echo 'images/'.$row["image"]; ?>" onclick="return showImage(this);">
<?php
echo '<img alt="gallery" src="images/'.$row["image"].'" class="pic-resize" alt=""></a>';
}
?>
<div id="light"><img src='' alt=''></div>
Now you just have to write the showImage() function in javascript that will do the actual work:
get the href attribute of the clicked link;
set the source of the image in #light to that value;
show the #light element.
I have written a web application that involves having users upload pictures to the site. On the homepage, I dynamically show the newest pictures/items uploaded in PHP, limiting it to ten. However, the page looks so static and I have searched on Google, bing, ask, yahoo, etc for days now and haven't had any answers.
I have written the code to store store the images, and get them from the db.
The images are shown on the homepage, and the only thing i have left to do is load it in a slider.
$sql = mysql_query("SELECT * FROM items ORDER BY item_date_added DESC LIMIT 10")or die(mysql_error());
while($row = mysql_fetch_array($sql)) {
//$user_id = $row['user_id'];
$item_name = $row['item_name'];
$item_id = $row['item_id'];
$check_pic = "users/$item_name.jpg";
if (file_exists($check_pic)) {
$show_pic = "<img src=\"users/$item_name.jpg\" width=\"100px\" height=\"100px\" border=\"5\" id='img'/>";
//$user_pic3 = "<img src=\"users/$rid/image01.jpg\" width=\"50px\" height=\"50px\" border=\"1\" />";
//$MemberDisplayList .= '' . $user_pic3 . '';
$i++;
$show_new_items .= "<a href='item_view?item_id=$item_id&&session_item=$item_id'>$show_pic</a>";
}
$newly_listed_names .= " <a href='item_view?item_id=$item_id&&session_item=$item_id'> $item_name </a> | ";
}
///////// END SHOW NEWLY ADDED ITEMS ///////////////////////////////////////////////////
the newly added items in echoed in a div in the body.
Can anyone help me please! it's been bothering me for a while now. Thanks.
To use Nivo, you need to generate html that looks something like this... (Download the nivo demo and open up the demo.html for the full source).
So all you need to do is output your images in a loop inside the slider div.
<div id="wrapper">
<div class="slider-wrapper theme-default">
<div id="slider" class="nivoSlider">
<?php
while($row = mysql_fetch_array($sql)){
$item_name = $row['item_name'];
$item_id = $row['item_id'];
$check_pic = "users/$item_name.jpg";
if (file_exists($check_pic)) {
print "<img src=\"users/$item_name.jpg\"/>";
$i++;
}
}
?>
<img src="images/2.jpg" data-thumb="images/2.jpg" alt=""/>
</div>
</div>
</div>
<script type="text/javascript" src="scripts/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="../jquery.nivo.slider.js"></script>
<script type="text/javascript">
$(window).load(function() {
$('#slider').nivoSlider();
});
</script>
You can use jquery plugins such as Nivo. Or you can try different jquery plugin from this link. And integrate it with your code.