I have some html code in my php script which i'm executing through echo. Suppose i want to access an image on the server which is saved in my uploads folder from within that echo, how do i do it? I tried this

$image = $row[8] //fetching the image name from the database

echo '<div><a href = "uploads/$image"</div>' // doesn't display.

The image doesn't display. please where is my mistake?

Recommended Answers

All 12 Replies

The image does not display because the <img/> tag is missing. Can you try it with

echo '<div><a href="uploads/$image"><img src="uploads/$image" alt="" /></a></div>'

Still doesn't work... I need it to work without the <img> tag because i'm trying to acheive like a zoom feature which i can only implement with the anchor tag.

You are missing an anchor text and closing tag for anchor element. Also enclose the string in double quotes to parse the variables. Consenquently you have to escape double quotes that surround html attribute values:

echo "<div><a href=\"uploads/$image\">$image</a></div>";

or use single quotes for enclosing html attribute values:

echo "<div><a href='uploads/$image'>$image</a></div>";

Try this

echo "<div><a href='uploads/" . $image . "'><img src='uploads/" . $image . "'></a></div>";

@naui95: he does not want to use the img tag.

@broj it works partially. The image shows only when i click the link(zoom). It doesn't show if the link isn't clicked. I have a couple of tags in between <a> and </a>. like this

echo "<a href=\"uploads/$image\" class=\"simple_image\" >"; //this is where the image is displayed
echo '<span style="display: none;" class="category_zoom">';
echo '<img src="styles/Images/ico-zoom.png" alt="Zoom Picture" title="Zoom Picture"/>';
echo '</span>';
echo '<img src="styles/Images/Product_photos/object1.jpg" alt="Image 1" title="" class="category_images_border"/>';
echo '</a>';

Do you see anything wrong?

The code seems to be correct. Is there a javascript library or special CSS that you are using to change display of the span from none to something else?

well i use jquery fancybox to zoom in on the image when it is clicked. But that part works fine. My problem is when i pull the image from the database, i want it to be displayed. But it remains blank until i click on it.

Member Avatar

How is the image supposed to be displayed without an <img> tag (either hardcoded or js-derived)?

echo "<a href=\"uploads/$image\" class=\"simple_image\" >"; //this is where the image is displayed

Isn't this the hard-coded image?

echo '<img src="styles/Images/Product_photos/object1.jpg" alt="Image 1" title="" class="category_images_border"/>';


On a previous page(where the image is uploaded and displayed using ajax and saved in the database). I displayed the image successfully on upload using
<a href="uploads/<?php echo $image; ?>"<!--some html tags in between as in my code above--></a>
i was trying to achieve the same thing here as well.
Using the <img> tag as in
'<img src="styles/Images/Product_photos/object1.jpg" alt="Image 1" title="" class="category_images_border"/>';
was skewing any image displayed and i didn't want that. That's why i'm tyring to using <a></a> as it worked before without skweing the images.

Member Avatar

Could you show the code for the previous page then. I just don't understand how you display the image without something like:

<img src="uploads/<?php echo $image; ?>" />

Obviously, JS can create this dynamically, but I don't think that's what you're doing is it?

<div class="product_item">
          <div class="product_left" > <a href="uploads/<?php echo $image; ?>" class="simple_image" title="" id="preview"><span class="product_zoom" style="display: none;">
          <img src="styles/Images/ico-zoom.png" alt="Zoom Picture" title="Zoom Picture" style="border:none;"/>
          </span><img src="styles/Images/Product_photos/object1.jpg" alt="Image 1" title=""/></a>

Thats it for the previous page and it works fine. i've gone ahead to implement it using the <img> tag. Skewed or not. Thanks for the contribution

Be a part of the DaniWeb community

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