CODEWITHSUNDEEP
phpmysqldatabaseimagepopup
sprog
sprog

Reputation: 73

How to put mysql data into popup window?

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 '<a href="#openModal"><img id="indPainting" src="'.$num.'" align="absmiddle" /></a> <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>
                <a href="#ok" title="Ok" class="ok">Ok</a>
        </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.

enter image description here

Upvotes: 2

Views: 1929

Answers (2)

user2541120
user2541120

Reputation:

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 '<a href="#openModal"><img id="indPainting" src="'.$num.'" align="absmiddle" /></a> <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><a href="#ok" title="Ok" class="ok">Ok</a></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..

Upvotes: 1

echo_Me
echo_Me

Reputation: 37253

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 '<a href="#openModal"><img id="indPainting" src="'.$num.'" align="absmiddle" /></a> <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>
            <a href="#ok" title="Ok" class="ok">Ok</a>
    </div>
</div>';
  echo '</td>';


}
     if ($colCnt==4)
    {
    echo '</tr>';
    $colCnt=0;
    }
}
mysql_close($con);
include 'footer.php'; 


 ?>

Upvotes: 0

Related Questions