Hi all,

I realise that this has been asked probably many times. I have searched but have not been able to find the relative answer - most likely not searching properly??

Anyway, what I would like to do is to display multiple images relating to one topic, ie. One member has 4 images associated with him/her and I need to display those images. There are multiple members and this must all be on one page. I have a MySql database setup with the member information, I will just add a field/s to the table that will hold the path to the images. Thinking a maximum of four images per member should suffice my needs. There is no need to search for a particular member, just a page that will display all members and just their basic information and then the photos.
Now comes the tricky part. I realise that the loading time of this could be quite substantial, so what I would like to do is have two images for each photo, ie. one scaled down and one original. The scaled down image would be the one that would appear in the table and then if clicked on, would load the original. That way, the loading time of the page will be a lot faster, especially when loading photos for 20 members or more!

Can the scaling down of the photos be done with PHP code or will that have to be done with a graphics program and saved seperately?

I haven't even started on the code yet, so if anybody can help me in the right direction I would be gratefull. I need to start working on this for the charity as they are now pushing me for something to go live soon.

Thanks in advance for the help guys!

Carter

  1. Adding a fixed number of images as columns will make scaling later much harder. I'd advise to use linked tables.
  2. You can use two images, but you can also choose to auto generate them, for example with phpThumb (or any similar package).

pritaeas
I was thinking of using one table generated programatically per member to display the information and photos. That way I don't have to worry about the quantity of members in the database. just loop through the members and generate the table (maybe div?) to display. Is this what you mean by linked tables?
I have had a look at phpThumb, will investigate if further for sure. Didn't know that it was out there, so thanks for the headsup on that one!

Yes, definately overkill! One table overall I should have said.
Going to start working on the page today, should have something up and running by the end of the week. Will post code as I go along to get ideas and improvements from Daniweb members. First bit of advice I would ask though. Table or div? I have traditionally used tables but understand that div's are better? What are your thoughts? Tables better for tabular but div's and css can do the same job?

Considering your layout with images, I think div's will do the job just fine. If your expected layout is really tabular, then why not use tables.

Having some problems, so here is some code. I keep on getting a server error (500) but don't know where I have gone wrong. Need to have this code live so I can actually see what it looks like and to start making improvements.

<?php
session_start();
//membership.php
if(($_SESSION['id']) && ($_SESSION['access_level'] == 1 || 2))
{
?>
<html>
<head>
    <title>Highlands 4x4 Response Group - Membership Details</title>
    <meta name="title" content="Highlands 4x4 Response Group">
    <meta name="generator" content="Microsoft FrontPage 6.0">
    <link rel="shortcut icon" href="images/favicon.ico">
    <meta http-equiv="Window-target" content="_top">
    <meta http-equiv="Content-Type" content="text/html; charset=us-ascii">
    <meta http-equiv="Content-Language" content="en-gb">
    <meta name="MSSmartTagsPreventParsing" content="TRUE"><!--A voluntary group of 4x4 enthusiasts providing a service to statutory and other bodies in times of crisis and severe weather-->
    <meta name="description" content="A voluntary group of 4x4 enthusiasts providing a service to statutory and other bodies in times of crisis and severe weather">
    <meta name="Abstract" content="A voluntary group of 4x4 enthusiasts providing a service to statutory and other bodies in times of crisis and severe weather">
    <meta name="keywords" content="membership,highland,4x4,response,land rover">
    <meta name="Robots" content="index, follow">
    <meta name="Distribution" content="Global">
    <meta name="Revisit-After" content="30 days">
    <meta name="Rating" content="General">
    <meta name="Reply-to" content="carterlangley@btinternet.com">
    <meta name="Owner" content="Highland 4x4 Response Group">
    <meta name="Author" content="Carter Langley">
    <meta name="copyright" content="Carter Langley - 2010">
    <meta name="generator" content="Microsoft FrontPage 6.0">
    <meta name="ProgId" content="FrontPage.Editor.Document">
    <link rel="stylesheet" type="text/css" href="mycss.css">
    <link rel="stylesheet" type="text/css" href="site.css">
</head>
<body>
  <div align="center">
    <table border="0" width="100%" id="table1" cellspacing="0" cellpadding="0" bgcolor="#000000">
      <tr>
        <td width="10%" height="0%" align="left">
            <a href="http://bulletin.scottish4x4response.org/index.php" target="_blank">
            <img border="0" src="images/logo_image.jpg" width="136" height="136" alt="Highland 4x4 Response Group"></a>
        </td>

        <td width="68%" align="center">
        <span class="mainbannertext">highland 4x4 response group</span>
        <table border="0" style="border-collapse: collapse" width="100%" cellpadding="0">
            <tr>
                <td valign="middle">
                <p align="center">
                <span class="subbannertext">registered charity - sc041948</span><br>
                <span class="subbannertext">click
                <a title="OSCR Listing for Highland 4x4 Response Group" target="_blank" href="http://www.oscr.org.uk/search-charity-register/charity-extract/?charitynumber=SC041948">
                here</a> for the oscr listing</span></td>
            </tr>
        </table>
        </td>

        <td width="22%">
          <p align="right">
            <a href="http://www.4x4response.info/" target="_blank">
            <img border="0" src="images/national4x4logo.gif" width="288" height="74" alt="The National 4x4 Response Network"></a></p>
        </td>
      </tr>
    </table>
  </div>
  <br>
  <table border="1" width="100%" cellpadding="0" style="border-collapse: collapse">
    <tr>
        <td align="left" width="34%" height="100" bgcolor="#808080">
        <p class="subbannertext ">your banner advert can be here</p></td>
        <td align="center" width="33%">
        <div align="center">
            <p class="pageheadertext">membership details</div></td>
        <td align="right" width="33%" bgcolor="#808080">
        <p class="subbannertext ">your banner advert can be here</p></td>
    </tr>
    </table><br>

        <?php
        $connect = mysql_connect("localhost", "user", "password") or die (mysql_error());
        mysql_select_db("databasename");
        $sql = "SELECT member.first_name, member.middle_name, member.last_name, member.home_mobile, member.emergency_contact_name, member.emergency_contact_phone, member.emergency_contact_altphone, member_vehicle.vehicle_make, member_vehicle.vehicle_model, member_vehicle.vehicle_registration_number, member_vehicle.photo_front, member_vehicle.photo_rear, member_vehicle.photo_left, member_vehicle.photo_right FROM member INNER JOIN member_vehicle ON member.member_id=member_vehicle.member_id ORDER BY member.last_name";
        $rs = mysql_query($sql);

        echo "<div align=\"center\">";
        echo "<table border=\"0\" style=\"border-collapse: collapse\" width=\"100%\" cellpadding=\"0\">";
        echo "<tr>";
        echo "<th>Name, Phone</th>";
        echo "<th>Vehicle Details</th>";
        echo "<th>Emergency Contact</th>";
        echo "<th>Photo</th>";
        echo "</tr>";
        while($row = mysql_fetch_assoc($rs))
        {
        echo "<tr>";
        echo "</td><td>";
        echo $row['first_name']." ";
        echo $row['middle_name']." ";
        echo $row['last_name'];
        echo "<br>";
        echo $row['home_mobile'];
        echo "</td><td>";
        echo $row['vehicle_make']." ";
        echo $row['vehicle_model']." ";
        echo "<br>";
        echo $row['vehicle_registration_number'];
        echo "</td><td>";
        echo $row['emergency_contact_name'];
        echo "<br>";
        echo $row['emergency_contact_phone']." ";
        echo $row['emergency_contact_altphone']." ";
        echo "</td><td>";
        echo $row['event_location'];
        echo "<img border=\"1\" src="$row['photo_front']">;
        echo "&nbsp;";
        echo "<img border=\"1\" src="$row['photo_rear']">;
        echo "<br>";
        echo "<img border=\"1\" src="$row['photo_left']">;
        echo "&nbsp;";
        echo "<img border=\"1\" src="$row['photo_right']">;
        echo "</td></tr>";
        }
        echo "</table>";
        mysql_close($connect);
        ?>
        </div>
</body>
</html>
<?php 
}
else
{
    echo "<script type=\"text/javascript\">
    alert(\"You don't belong here!\");
    window.location=\"index.htm\"</script>";
}
?>

With the code above, can you see anything that is not right?

this is what I now have on line 112.

echo "<img border=\"1\" src="$row['photo_front']">";

The source is a file location which is stored in the database. I can't find what I am doing wrong, so a help in the right direction will be appreciated. Also, to help me understand could you please let me know what I have done wrong and why it is wrong?

echo "<img border=\"1\" src="$row['photo_front']">";

You need to escape the double quotes, just like you did with the border attribute:

echo "<img border=\"1\" src=\"{$row['photo_front']}\">";

Adding the curly braces improves readability in my opinion.

As simple as that! Thanks so much, now I can see where to make improvements and some are glaringly obvious now that I can see it live! Thank you so much!

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.