[Okta Webinar] Learn how to a build a cloud-first strategyRegister Now

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 138
  • Last Modified:

Display multiple images in the row in PHP

Hi Experts:

I have the php code which works fine in displaying a image (picture) and data for each row in the table.  Sometimes there are more than 1 images in a row.  Currently it is displaying only one image (picture).

How can we modify the code to display more than 1 image (if present) in the row?

<?php
// list.php

$field = $_GET["f"];
$q = $_GET["q"];
$where = "";
if (!empty($q)) {
    $where = " WHERE `".addslashes($field)."` LIKE '%" . addslashes($q) . "%'";
}

// Connects to your Database 
$dbh=mysql_connect("jackrealestatecom.jillmysql.com", "jack", "Cher!f2015") or die(mysql_error()) ; 
mysql_select_db("properties") or die(mysql_error()) ; 
//count number of records
$query = "SELECT * FROM listings".$where;
//echo $query;
$result = mysql_query($query) or die(mysql_error());
$num_rows = mysql_num_rows($result);

if(mysql_num_rows($result) == 0) {
  echo "No results were found.";
}

//number you want to display per page
$page_rows=10;

//This tells us the page number of last page
$last=ceil($num_rows/$page_rows);

//determine results
//This checks to see if there's a page number.  If not, it will set it to page 1.
if(isset($_GET['pagenum'])) {
  $pagenum=$_GET['pagenum'];
}
else{
  $pagenum=1;
}

$pagenum=(int)$pagenum;
if ($pagenum>$last)
{
$pagenum=$last;
}

if ($pagenum<1)
{
$pagenum=1;
}

$offset=($pagenum - 1) * $page_rows;

$i=1;

//Retrieves data from MySQL 
$result = mysql_query("SELECT * FROM listings $where ORDER BY id LIMIT $offset, $page_rows") or die(mysql_error());  //Puts it into an array 
while($row = mysql_fetch_array($result))
  {
  //Outputs the image and other data
$id=$row['id'];
$image=$row['image'];
$name=$row['name'];
$location=$row['location'];
$description=$row['description'];
$area=$row['area'];
$type=$row['type'];


echo "<table border='1' BORDERCOLOR='#7E2217' cellpadding='10' width='100%' style='table-layout:fixed'><col width='38' /><col width='200' />" ; 
echo "<tr align=left><th colspan='2'><font color='black'> <b>". $name ."</b><br>". $location. "</font></th></tr>"; 
echo "<tr VALIGN=TOP><td align='center'><img src=images/". $image ." style=\"width:100px;height:150px\"</td>" ;
  echo "<td><font color='black'><b>Listing Id:</b> ". $id. "<br><br>";
  echo "<b>Property Type:</b> ". $type. "<br><br>";
  echo "<b>Area (in Sq. ft.):</b> ". $area. "<br><br>";
  echo "<b>Description:</b><br>". $description. "</font></td></tr>";
echo "</table><br>";

$i++;
}
echo "<p align='left'>Page</p>";
for ($i=1; $i<=$last; $i++)
{
if (($i=="1") && ($i==$pagenum))
{
echo "<font size=3>";
echo " <a href='{$_SERVER['PHP_SELF']}?pagenum=1&amp;i=$id&amp;q=$q&amp;f=$field'>";
echo "<font size=5>";
echo $i;
echo "&nbsp;";
echo "</font>";
echo "</a>";
echo "</font>";
}
elseif (($i=="1") && ($i!=$pagenum))
{
echo "<font size=3>";
echo " <a href='{$_SERVER['PHP_SELF']}?pagenum=1&amp;i=$id&amp;q=$q&amp;f=$field'>";
echo $i;
echo "&nbsp;";
echo "</a>";
echo "</font>";
}
elseif (($i>1) && ($i!=$last) && ($i==$pagenum))
{
echo "<font size=3>";
echo " <a href='{$_SERVER['PHP_SELF']}?pagenum=$pagenum&amp;i=$id&amp;q=$q&amp;f=$field'>";
echo "<font size=5>";
echo $i;
echo "&nbsp;";
echo "</font>";
echo "</a>";
echo "</font>";
}
elseif (($i>1) && ($i!=$last) && ($i!=$pagenum))
{
$next = $pagenum+1;
echo "<font size=3>";
echo " <a href='{$_SERVER['PHP_SELF']}?pagenum=$i&amp;i=$id&amp;q=$q&amp;f=$field'>";
echo $i;
echo "&nbsp;";
echo "</a>";
echo "</font>";
}
elseif (($i==$last) && ($i==$pagenum))
{
echo "<font size=3>";
echo " <a href='{$_SERVER['PHP_SELF']}?pagenum=$last&amp;i=$id&amp;q=$q&amp;f=$field'>";
echo "<font size=5>";
echo $i;
echo "&nbsp;";
echo "</font>";
echo "</a>";
echo "</font>";
}
elseif (($i==$last) && ($i!=$pagenum))
{
echo "<font size=3>";
echo " <a href='{$_SERVER['PHP_SELF']}?pagenum=$last&amp;i=$id&amp;q=$q&amp;f=$field'>";
echo $i;
echo "&nbsp;";
echo "</font>";
echo "</a>";
}
}

?> 

Open in new window

0
imranasif17
Asked:
imranasif17
  • 4
  • 4
  • 2
  • +1
1 Solution
 
Kim WalkerWeb Programmer/TechnicianCommented:
This expert suggested creating a Gigs project.
This is going to be very complicated. It appears that each row has a two table cells. One cell contains the image and the other contains a description of that image. First, the structure would have to be modified to allow for multiple combinations of the two cells. Second, the database query would need to be modified to group the images that belong together. Thirdly, a loop would need to be created to loop through the grouped images.

The solution to this question is much too complicated for this forum. Allow me to recommend EE Gigs where you can hire an expert to devote the appropriate attention this project needs.
2
 
imranasif17Author Commented:
Hi Kim:

I think we need to do only 2 and 3.  Description here is not the description of the image(s).  Can you help please?

Thanks.
0
 
Kim WalkerWeb Programmer/TechnicianCommented:
So there are multiple images for some rows but only one description per row?

How are the additional images stored in the database? Is there a separate record in the database for each image, or for each row?
0
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
imranasif17Author Commented:
So there are multiple images for some rows but only one description per row?

Yes that's correct.  

I am using html/php form to submit data and multiple images for each row.  The form accepts multiple images but when displayed in the table, only one image is displayed.

Here is the code for the form:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<script type='text/javascript'><!--
function initFlyouts(){initPublishedFlyoutMenus([{"id":"122664640769900158","title":"Library Catalog","url":"index.html"},{"id":"532658225518218983","title":"About the Library","url":"http:\/\/icscborrowinglibrary.com\/aboutlibrary.html"},{"id":"813612181614597800","title":"Ask a Librarian","url":"ask-a-librarian.html"},{"id":"939506420111845331","title":"Support your Library","url":"support-your-library.html"}],'845325556776834118',"<li class='wsite-nav-more'><a href='#'>more...<\/a><\/li>",'',false)}
if (Prototype.Browser.IE) window.onload=initFlyouts; else document.observe('dom:loaded', initFlyouts);
//-->
</script>
</head>
<body class='wsite-theme-light wsite-page-add-books weeblypage-add-books'>
<div id="wrapper">
        <div id="container">
            <div id="header" class="wsite-header"></div>

            
            
            
            <div id="contenttop">
                <div id="contentbtm">
                    <div id="content">
                <div id='wsite-content' class='wsite-not-footer'>
<div class='wsite-not-footer'>
<div ><div id="698106845765048406" align="left" style="width: 100%; overflow-y: hidden;" class="wcustomhtml"><form enctype="multipart/form-data" action="add.php" method="POST">
<h3><font color='black'>Add Properties:</font></h3>
<br />
<table> 
<tr><td><font color='black'>Name:</font></td><td> <input type="text" name="name" size="40"></td></tr> 
<tr><td><font color='black'>Location:</font></td><td> <input type="text" name="location" size="40"></td></tr> 
<tr><td><font color='black'>Description:</font></td><td><textarea cols="31" rows="6" name="description"></textarea></td></tr> 
<tr><td><font color='black'>Area:</font></td><td> <input type="text" name="area" size="40"></td></tr>
<tr><td><font color='black'>Call #:</font></td><td> <input type="text" name="callnum" size="40"></td></tr> 
<tr><td><font color='black'>Property Type:</font></td><td> 
   <select name="type">
     <option value="Single Family Home">Single Family Home</option>
     <option value="Commercial">Commercial</option>    
     <option value="Condo">Condo</option>
     <option value="Apartment">Apartment</option>
   </select>
 </td></tr> 
<tr><td><font color='black'>Photo:</font></td><td> <input type="file" name="photo" size="40"></td></tr> 
<tr><td></td><td><input type="submit" value="Add"></td></tr></font>
</table></form><hr>
</div>



</div>

</div>
</div>

                    <div class="clear"></div>
                    </div>
                </div>        
            </div>
                <div id="footer" align='center'>
<a name="fb_share">Share us on Facebook</a> 
<script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" 
        type="text/javascript">
</script>&nbsp;&nbsp;
                    <A HREF="faqs.html"><u>FAQs</u></A>&nbsp;&nbsp;&nbsp;&nbsp;<A HREF="recommend.html"><u>Recommend a purchase</u></A>&nbsp;&nbsp;
<a href="https://twitter.com/share" class="twitter-share-button">Tweet</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
                </div>
        <div class="clear"></div>        
        </div>            
    </div> 

</body>
</html>

<?php

// Connects to your Database 
$dbh=mysql_connect("MYSITE.com", "USER", "PASSWORD") or die(mysql_error()) ; 
mysql_select_db("DATABASE") or die(mysql_error()) ; 
$maxsize = 10000000;


if($_POST) {
  //This is the directory where images will be saved 
  $target = "images/";
  $target = $target . basename( $_FILES['photo']['name']); 

  $photosize = $_FILES['photo']['size']; 
  if($photosize > $maxsize){
    echo "Sorry, file size exceeds the limit.<br><br>"; 
    exit();
   }

 
  //This gets all the other information from the form 
  $name=$_POST['name']; 
  $location=$_POST['location'];
  $callnum=$_POST['callnum'];
  $type=$_POST['type'];  
  $description=$_POST['description']; 
  $area=$_POST['area']; 
  $pic=$_FILES['photo']['name']; 
 
  //Writes the information to the database 
  mysql_query("INSERT INTO listings (id,name,location,description,callnum,type,area,image)  VALUES ('$id', '$name', '$location', '$description', '$callnum', '$type', '$area', '$pic')") ; 
 
  //Writes the photo to the server 
  if(move_uploaded_file($_FILES['photo']['tmp_name'], $target)) { 
    //Tells you if its all ok 
    echo "The file ". basename( $_FILES['uploadedfile']['name']). " has been uploaded, and your information has been added to the directory<br><br>"; 
  } else { 
    //Gives and error if its not 
    echo "Sorry, there was a problem uploading your file.<br><br>"; 
  } 
}
// close the database connection
mysql_close($dbh)

?> 

Open in new window

0
 
Kim WalkerWeb Programmer/TechnicianCommented:
This form does not accept multiple images. I'm familiar with your other question about how to modify the form to accept multiple images. Adding the multiple attribute will allow the form to upload multiple images, but the processing routine will have to be modified to process multiple images too. How do you plan to store the additional images?

Do you already have some rows that have multiple images? How are they being displayed now? Are they being displayed on multiple rows? This would indicate that there is a separate row in the database for each image. If so, we need to modify the database query to group them.

This is why this is too complicated for this forum. There are too many variables that need to be ironed out.
0
 
Ray PaseurCommented:
Once necessary step will be to get off the MySQL extension ASAP.  This article explains why and gives examples showing how.
https://www.experts-exchange.com/articles/11177/PHP-MySQL-Deprecated-as-of-PHP-5-5-0.html
0
 
Amita SinghWeb DeveloperCommented:
please share your sql file or site demo link.
0
 
imranasif17Author Commented:
Hi Amita:

Here is the SQl file.  I am not sure if this is what you are looking for.

Thanks.
listings.sql
0
 
Kim WalkerWeb Programmer/TechnicianCommented:
None of these appear to have multiple images. So it's impossible to determine how they would be collected or delivered.
0
 
Amita SinghWeb DeveloperCommented:
Kim is right. is sql no multiple images.
0
 
imranasif17Author Commented:
Thanks.
0

Featured Post

Free Tool: Site Down Detector

Helpful to verify reports of your own downtime, or to double check a downed website you are trying to access.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

  • 4
  • 4
  • 2
  • +1
Tackle projects and never again get stuck behind a technical roadblock.
Join Now