How to put mysql data into popup window? - php

I have a web page with images and when user clicks on any of the image, it has to derive data of that particular image from MYSQL database. What I am doing is using a simple JavaScript popup and putting the data from database. However I am just getting the first item from database on all images.
This is the code:
$files = glob("admin/images/paintings/*.*");
echo '<div id="painting"><table border="0" style="width:590px;">';
$colCnt=0;
$i = 0;
while($row = mysql_fetch_array($result))
{
if ($colCnt%4==0)
echo '<tr>';
echo '<td width="25%" style="font-size:8.5px; font-family:arial">';
echo($i);
$num = $files[$i];
echo '<img id="indPainting" src="'.$num.'" align="absmiddle" /> <br> <div id="paintingName">';
print $row['name'];
echo '<div id="openModal" class="modalWindow">
<div>
<p>This is a sample modal window that can be created using CSS3 and HTML5.'.$row['name'].'</p>
Ok
</div>
</div>';
echo '</td>';
$colCnt++;
if ($colCnt==4)
{
echo '</tr>';
$colCnt=0;
}
$i++;
}
mysql_close($con);
include 'footer.php';
?>
$row['name'] is just giving out the first name as it is in a while loop. I am not being able to get other names for other images. How can this be done. Any help would be appreciated.

Does one iteration in your while fetch single image data? And what I can understand according to your code is that you are displaying 4 image in a row.
Can you please format your code a bit..its looking too ugly.
I need to know which statement is calling your modal window.
<?php
$files = glob("admin/images/paintings/*.*");
echo '<div id="painting"><table border="0" style="width:590px;">';
$colCnt=0;
$i = 0;
echo '<tr>';
while($row = mysql_fetch_array($result))
{
$num = $files[$i];
echo '<td width="25%" style="font-size:8.5px; font-family:arial">';
echo '<img id="indPainting" src="'.$num.'" align="absmiddle" /> <br>
<div id="paintingName">';
print $row['name'];
echo '<div id="openModal" class="modalWindow"><div><p>This is a sample modal window that can be created using CSS3 and HTML5.'.$row['name'].'</p>Ok</div>
</div></td>';
$colCnt++;
if ($colCnt % 4 == 0)
{
echo '</tr>';
$colCnt=0;
}
$i++;
}
mysql_close($con);
include 'footer.php';
?>
Try this.
Also see how beautiful the code looks if its properly formatted..

try this
<?php
$files = glob("admin/images/paintings/*.*");
echo '<div id="painting"><table border="0" style="width:590px;">';
$colCnt=4;
while($row = mysql_fetch_array($result))
{
for ($i = 0; $i < $colCnt; $i++) {
echo '<tr>';
echo '<td width="25%" style="font-size:8.5px; font-family:arial">';
echo($i);
$num = $files[$i];
echo '<img id="indPainting" src="'.$num.'" align="absmiddle" /> <br> <div id="paintingName">';
print $row['name'];
echo '<div id="openModal" class="modalWindow">
<div>
<p>This is a sample modal window that can be created using CSS3 and HTML5.'.$row['name'].'</p>
Ok
</div>
</div>';
echo '</td>';
}
if ($colCnt==4)
{
echo '</tr>';
$colCnt=0;
}
}
mysql_close($con);
include 'footer.php';
?>

Related

PHP issues displaying image gallery

I'm trying to make a gallery with PHP. I want to get all of the images out of a folder and then display them in rows of 3. I kind of have it working but the first 2 images mess up.
This is what I've tried:
$images = glob("$_SERVER[DOCUMENT_ROOT]/gallery/img*.{png,jpg,gif}", GLOB_BRACE);
echo '<table width="100%>';
$count="-1";
foreach($images as $image) {
if ($count%3 == 1) {
echo '<tr>';
}
$url=str_replace("/home/#####/public_html/gallery", "", $image);
echo '<td width="33%"><div class="gallery">';
echo '<img onclick="window.location='.$url.'" src="'.$url.'" alt="Image Alt" width="400" height="300">';
echo '</div></td>';
if ($count%3 == 3) {
echo '</tr>';
}
//echo $count;
$count++;
//echo "|".$count;
}
if ($count%3 != 1) {
echo ',</tr>';
}
echo '</table>';
//echo print_r($images);
This works kind of but it makes this:
(These are just stock photos, the real photos are a bit.. offensive)
I know I'm doing something wrong but I don't know what!
There were some errors in your code (see comments). Maybe try this:
$images = glob("$_SERVER[DOCUMENT_ROOT]/gallery/img/*.{png,jpg,gif}", GLOB_BRACE);
echo '<table style="width:100%">'; // error was here (missing ")
$count = 0; // error was here (counter = "-1")
foreach ($images as $image) {
// start <tr> on 0
if ($count == 0) {
echo '<tr>';
}
$url=str_replace("/home/#####/public_html/gallery/", "", $image);
echo '<td style="width:33%"><div class="gallery">'; // alternative
echo '<img onclick="window.location='.$url.'" src="'.$url.'" alt="Image Alt" width="400" height="300">';
echo '</div></td>';
// end tr at 3
if ($count == 3) {
echo '</tr>';
// reset counter
$count = -1;
}
$count++;
}
echo '</table>';
I think you have trouble with your $count initial value.
Try this:
$count="3";
foreach($images as $image) {
if ($count%3 == 0) {
echo '<tr>';
}
$count++;
...

PHP: Show 3 td's of data per table row

I am wanting to use 8 images from my database and load them into a HTML Table. I would like to display 4 images per table row, but however when i run my code below, i seem to get all images in one table row. Any help would be great. Thank you in advance.
$count = $get->rowCount();
if ($count > 0)
{
echo '<table id="" class="uiGrid _51mz _1m6c" cellpadding="2" cellspacing="0">';
$i = 0;
while ($r = $get->fetch(\PDO::FETCH_OBJ))
{
$globals = new \Libraries\Helpers\Views\Globals;
if ($i == 0)
{
echo '<tr class="_51mx">';
}
echo '
<td class="_51m-">
<a href="/e/a/'.$r->data_id.'">
<div class="uiScaledImageContainer _f-u2" style="width:74px;height:74px;">
<img class="scaledImageFitWidth img" src="https://gstatic.acfee.org/akamaihd/i/'.$globals->data_image_name($r->data_id).'">
<div class="_3s6x">
<div class="_50f3"></div>
</div>
</div>
</a>
</td>
';
if ($i > 4)
{
$i = 0;
echo '</tr>';
};
$i++;
echo '
<script type="text/javascript">
$("#favs-preloader").hide();
</script>
';
}
echo '</table>';
put this code directly it will works...
echo '<table id="" class="uiGrid _51mz _1m6c" cellpadding="2" cellspacing="0">';
$i = 0;
while ($r = $get->fetch(\PDO::FETCH_OBJ))
{
$globals = new \Libraries\Helpers\Views\Globals;
$i++;
if ($i == 1)
{
echo '<tr class="_51mx">';
}
echo '
<td class="_51m-">
<a href="/e/a/'.$r->data_id.'">
<div class="uiScaledImageContainer _f-u2" style="width:74px;height:74px;">
<img class="scaledImageFitWidth img" src="https://gstatic.acfee.org/akamaihd/i/'.$globals->data_image_name($r->data_id).'">
<div class="_3s6x">
<div class="_50f3"></div>
</div>
</div>
</a>
</td>
';
if ($i >= 4)
{
echo '</tr>';
$i = 0;
};
echo '
<script type="text/javascript">
$("#favs-preloader").hide();
</script>
';
}
echo '</table>';
In your current code, you're verifying if the $i variable is == 0 in order to add a row. But you're always increasing it's value at the end, even after you set it to zero in the if($i > 4)
Change these lines
if ($i > 4)
{
$i = 0;
echo '</tr>';
};
$i++;
To this:
if ($i > 4)
{
$i = 0;
echo '</tr>';
}
else
$i++;

How to add images from database with caption

What I want to do is that, It should display 3 images on every line and along with their captions.And their could be many rows. How can do that ? here is my code..
while($info=mysql_fetch_array($query))
{
$image=$info['image'];
$cap=$info['caption'];
echo '<img src="'.$image.'" />';
echo $cap;
}
I got the answer.
I don't know hows its working . But it is ....
<table>
<?php
$i=1;
$query=mysql_query("SELECT * FROM publish");
while($info=mysql_fetch_array($query))
{
$inq=$info['ref'];
$imagesrc=$info['image'];
$ti=$info['title'];
if($i%3==1 || $info['id']==1 )
{
echo "<tr></tr>";
}
?>
<td>
<a href="movieview.php?ref=<?php echo $info['ref']; ?>">
<?php
echo '<img src="admin/'.$imagesrc.'" style="width:138px;height:200px;" />';
echo '</a><br />';
echo $ti;
$i++;
}
?>
</td>
</table>

Displaying all Images within a Folder using php

I've used this php code within my html in order to display all pictures within a folder called uploads. The only problem is that icons images are the only type of image being displayed. What have I done wrong?
<?php
$files = glob("uploads/*.*");
$colCnt=0;
echo '<table border="1" style="width:590px;">';
for ($i=1; $i<count($files); $i++)
{
$colCnt++;
if ($colCnt==1)
echo '<tr>';
echo '<td width="25%" style="font-size:8.5px; font-family:arial">';
$num = $files[$i];
echo '<img src="'.$num.'" align="absmiddle" /> ';
print substr(substr($num,6,100),0,-4);`
echo '</td>';
if ($colCnt==4)
{
echo '</tr>';
$colCnt=0;
}
}
echo '</table>';
?>
The loop seems to be ok.
You have to focus on the result coming from
$files = glob("uploads/*.*");
Try print_r($files) to get the list and then see if it is selecting all the images properly or not.

display 2 or 3 images per row using php mysql

hi i'm disaplyed images from mysql db table but it displays on by one means one row has one image. but i need 3 or 4 image per row. my coding is below. please give some idea.
<?php
include_once("config.php");
$result=mysql_query("SELECT * FROM merchant");
while($res=mysql_fetch_array($result))
{
?>
<?php echo $res['description'];?></p>
<img src="<?php echo $res['image'];?>" width="80" height="80"/>
<?php } ?>
Do it in table like this, You might need to fix it a little bit, but it way how it will work
<table>
<?php
include_once("config.php");
$result=mysql_query("SELECT * FROM merchant");
$count = 0;
while($res=mysql_fetch_array($result))
{
if($count==3) //three images per row
{
print "</tr>";
$count = 0;
}
if($count==0)
print "<tr>";
print "<td>";
?>
<?php echo $res['description'];?></p>
<img src="<?php echo $res['image'];?>" width="80" height="80"/>
<?php
$count++;
print "</td>";
}
if($count>0)
print "</tr>";
?>
</table>
use a <table> to display.
<?php
include_once("config.php");
$result=mysql_query("SELECT * FROM merchant");
$count = 0;
echo '<table>';
while($res = mysql_fetch_array($result))
{
if($count % 2 == 0) echo '<tr>';
?>
<td>
<p><?php echo $res['description'];?></p>
<img src="<?php echo $res['image']; ?>" width="80" height="80"/>
</td>
<?php
if($count % 2 == 0) echo '</tr>';
} ?>

Categories