Images are not displaying(PHP MySQL)

Report · May 19, 2012

Hi,

I've created a database table (MySQL) to store file path of images stored in a folder but the only problem is that the images are not displaying on the web page. Here's the procedure that I've used:

-Placed the cusor at the insertion point (div).

-Then selected 'Insert image' from the insert menu.

-Selected 'data sources' in the select image dialogue box.

-Selected the 'path' field in the recordset containing the image details of the images I want to display.

-Then OK.

Here's the code generated:

<td colspan="3" nowrap="nowrap"><img src="<?php echo $row_rsBanner['path']; ?>" width="950" height="141"/></td>

Here's the client side code generated:

But the funniest thing is that if I pull the image as a background of the <td> (table data) it displays perfectly.

Here's the code:

<td colspan="3" nowrap="nowrap" background="<?php echo $row_rsBanner['path']; ?>" width="950" height="141"></td>

Can someone please give an idea of how I can pull the image using the <img> tag and not as a background.

Report · May 19, 2012

Can you post the page that is generated so we can see if this is a path issue or something else going on?

Report · May 21, 2012

The page is still on the local server, no web server. It's just but a project for learning purposes.

Report · May 21, 2012

Paste the source code from the browser into this thread.

Report · May 25, 2012

Here's the source code from the browser for pulling the photo;

And here's the source code for the whole page (It's quite long because I had not yet mastered CSS);

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<head>

<title>Untitled Document</title><style type="text/css">

<!--

@import url("links2.css");

body {

background-image: url();

background-repeat: no-repeat;

}

-->

</style>

</style>

<link rel="stylesheet" href="style.css" type="text/css" media="screen" />
<script src="jquery-latest.pack.js" type="text/javascript"></script>
<script src="jcarousellite_1.0.1c4.js" type="text/javascript"></script>
<script type="text/javascript">
$(function() {
     $(".newsticker-jcarousellite").jCarouselLite({
          vertical: true,
          hoverPause:true,
          visible: 2,
          auto:500,
          speed:1000
     });
});
</script>
<style type="text/css">
<!--
a:link {
     text-decoration: none;
}
a:visited {
     text-decoration: none;
}
a:hover {
     text-decoration: underline;
}
a:active {
     text-decoration: none;
}
-->
</style>
<link href="links2.css" rel="stylesheet" type="text/css" />
<link href="link2.css" rel="stylesheet" type="text/css" />
<link href="categories.css" rel="stylesheet" type="text/css" />
</head>

<body>
<div align="center">
  <table width="51%" height="539" border="3" align="center" bordercolor="#008FE6">

    <tr>
      <th scope="col"><table width="85%" height="518" border="1" align="center" bordercolor="#D2EEFF">
        <tr>
          <td height="126" colspan="3"><p align="center"><img src="C:/xampp/htdocs/Dirwebclient/banner3A.png" alt="jpeg" width="950" height="124" /></p></td>
        </tr>
        <tr bordercolor="#A6DDFF" bgcolor="#A6DDFF">
          <td height="26" colspan="3" bgcolor="#A6DDFF"><table width="579" border="0" align="left">
              <tr>
                                <th width="573" height="20" scope="row"><div align="left"><a href="visualindex2.php?recordID=1" class="links">HOME</a></div></th>

                                <th width="573" height="20" scope="row"><div align="left"><a href="visualindex2.php?recordID=2" class="links">ABOUT US</a></div></th>
                                <th width="573" height="20" scope="row"><div align="left"><a href="visualindex2.php?recordID=3" class="links">SERVICES</a></div></th>
                                <th width="573" height="20" scope="row"><div align="left"><a href="visualindex2.php?recordID=4" class="links">CONTACTS</a></div></th>
                                <th width="573" height="20" scope="row"><div align="left"><a href="visualindex2.php?recordID=5" class="links">BOOKING</a></div></th>
                              </tr>
            </table>
              <table width="220" border="0" align="right" cellpadding="0">

                <tr>
                  <td width="248"><div align="right" class="style2">
                      <div align="center">
                        <!-- #BeginDate format:fcAm1a -->Saturday, May 19, 2012 1:07 AM<!-- #EndDate -->
                      </div>
                  </div></td>
                </tr>
            </table></td>

        </tr>
        <tr>
          <td bordercolor="#FFFFFF" bgcolor="#D2EEFF"><table width="201" height="250" border="3" align="left" cellpadding="0" bordercolor="#7DCEFF" bgcolor="#D2EEFF">
            <tr>
              <td width="215" height="164"><div align="left">
                  
                  <table width="199" height="77" border="0" align="center" cellpadding="0" bordercolor="#7DCEFF">
                    <tr bgcolor="#A6DDFF">
                      <td width="215" height="35"><div align="center">
                          
                          <span class="categories">CATEGORIES</span> </div>

                          </td>
                    </tr>
                                        <tr>
                      <td height="36"><div align="left"><a href="visualindex2.php" class="links2">Plumbing</a>
                        <hr />
                      </div></td>
                    </tr>
                                        <tr>

                      <td height="36"><div align="left"><a href="visualindex2.php" class="links2">Electricals</a>
                        <hr />
                      </div></td>
                    </tr>
                                        <tr>
                      <td height="36"><div align="left"><a href="visualindex2.php" class="links2">Fittings</a>
                        <hr />
                      </div></td>

                    </tr>
                                        <tr>
                      <td height="36"><div align="left"><a href="visualindex2.php" class="links2">Roofing</a>
                        <hr />
                      </div></td>
                    </tr>
                                        <tr>
                      <td height="36"><div align="left"><a href="visualindex2.php" class="links2">Electronics</a>

                        <hr />
                      </div></td>
                    </tr>
                                      </table>
              </div>
                  
                &nbsp;</td>
            </tr>
          </table>
          <p>&nbsp;</p>

            <p>&nbsp;</p>
            <p>&nbsp;</p>
            <p>&nbsp;</p>
            <p>&nbsp;</p>
            <p>&nbsp;</p>
            <p>&nbsp;</p>
            <p>&nbsp;</p></td>
          <td height="256" bordercolor="#FFFFFF"><table width="500" height="251" border="3" align="center" bordercolor="#7DCEFF">
              <tr bordercolor="#FFFFFF">

                <td width="469" height="247" bgcolor="#FFFFFF"><script type="text/javascript">
AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0','width','499','height','245','src','images/slideview','quality','high','flashvars','flashlet={imageLinkTarget:\'_blank\',captionFont:\'Verdana\',titleFont:\'Verdana\',showControls:false,frameShow:false,slideDelay:5,captionColor:#333333,transitionsType:\'Fade\',titleColor:#333333,slideAutoPlay:true,imageURLs:[\'images/test2.JPG\',\'images/test.JPG\',\'images/test1.JPG\'],slideLoop:true,imageLinks:[\'http://macromedia.com/\',\'http://macromedia.com/\',\'http://macromedia.com/\'],frameColor:#333333,bgColor:#D2EEFF,imageCaptions:[],title:\'VISUAL CONCEPT MEDIA\'}','pluginspage','http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash','flash_component','ImageViewer.swc','movie','images/slideview' ); //end AC code
                </script>
                  <noscript>
                  <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="499" height="245">
                    <param name="flash_component" value="ImageViewer.swc" />
                    <param name="movie" value="images/slideview.swf" />
                    <param name="quality" value="high" />
                    <param name="FlashVars" value="flashlet={imageLinkTarget:'_blank',captionFont:'Verdana',titleFont:'Verdana',showControls:false,frameShow:false,slideDelay:5,captionColor:#333333,transitionsType:'Fade',titleColor:#333333,slideAutoPlay:true,imageURLs:['images/test2.JPG','images/test.JPG','images/test1.JPG'],slideLoop:true,imageLinks:['http://macromedia.com/','http://macromedia.com/','http://macromedia.com/'],frameColor:#333333,bgColor:#D2EEFF,imageCaptions:[],title:'VISUAL CONCEPT MEDIA'}" />
                    <embed src="images/slideview.swf" quality="high" flashvars="flashlet={imageLinkTarget:'_blank',captionFont:'Verdana',titleFont:'Verdana',showControls:false,frameShow:false,slideDelay:5,captionColor:#333333,transitionsType:'Fade',titleColor:#333333,slideAutoPlay:true,imageURLs:['images/test2.JPG','images/test.JPG','images/test1.JPG'],slideLoop:true,imageLinks:['http://macromedia.com/','http://macromedia.com/','http://macromedia.com/'],frameColor:#333333,bgColor:#D2EEFF,imageCaptions:[],title:'VISUAL CONCEPT MEDIA'}" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="499" height="245"> </embed>
                  </object>
                  </noscript>                  </td>
              </tr>
          </table></td>
          <td height="256" bgcolor="#D2EEFF"><table width="218" height="229" border="3" align="right" cellpadding="0" bordercolor="#7DCEFF" bgcolor="#EAF4F5" margin="0">
              <tr>
                <td width="198" height="188" bgcolor="#EAF4F5"><div id="newsticker-demo">

                  <div class="title">
                    <p class="categories">Latest News</p>
                  </div>
                  <div class="newsticker-jcarousellite">
                    <ul>
                                            <li>
                        <div class="thumbnail"><img src="C:/xampp/htdocs/Dirwebclient/5.jpg" alt="jpeg" width="90" height="78" /></div>
                        <div class="info"> <a href="http://www.vladstudio.com/wallpaper/?knight_lady"></a> <span class="cat"></span> </div>

                        <div class="clear"></div>
                      </li>
                                            <li>
                        <div class="thumbnail"><img src="C:/xampp/htdocs/Dirwebclient/4.jpg" alt="jpeg" width="90" height="78" /></div>
                        <div class="info"> <a href="http://www.vladstudio.com/wallpaper/?knight_lady"></a> <span class="cat"></span> </div>
                        <div class="clear"></div>
                      </li>

                                            <li>
                        <div class="thumbnail"><img src="C:/xampp/htdocs/Dirwebclient/3.jpg" alt="jpeg" width="90" height="78" /></div>
                        <div class="info"> <a href="http://www.vladstudio.com/wallpaper/?knight_lady"></a> <span class="cat"></span> </div>
                        <div class="clear"></div>
                      </li>
                                            <li>
                        <div class="thumbnail"><img src="C:/xampp/htdocs/Dirwebclient/2.jpg" alt="jpeg" width="90" height="78" /></div>

                        <div class="info"> <a href="http://www.vladstudio.com/wallpaper/?knight_lady"></a> <span class="cat"></span> </div>
                        <div class="clear"></div>
                      </li>
                                            <li>
                        <div class="thumbnail"><img src="C:/xampp/htdocs/Dirwebclient/1.jpg" alt="jpeg" width="90" height="78" /></div>
                        <div class="info"> <a href="http://www.vladstudio.com/wallpaper/?knight_lady"></a> <span class="cat"></span> </div>

                        <div class="clear"></div>
                      </li>
                                            <li>
                        <div class="thumbnail"><img src="C:/xampp/htdocs/Dirwebclient/6.jpg" alt="jpeg" width="90" height="78" /></div>
                        <div class="info"> <a href="http://www.vladstudio.com/wallpaper/?knight_lady"></a> <span class="cat"></span> </div>
                        <div class="clear"></div>
                      </li>

                                          </ul>
                  </div>
                </div>                <p>&nbsp;</p>
                  </td>
              </tr>
          </table></td>
        </tr>
        <tr bgcolor="#A6DDFF">

          <td width="215" bgcolor="#D2EEFF" class="style2">&nbsp;</td>
          <td width="503" height="63" bgcolor="#A6DDFF" class="style2"><table width="479" height="61" border="0" align="center">
              <tr>
                <td width="558" height="57"><p align="center" class="style1">WELCOME TO VISUAL CONCEPT MEDIA</p>
                    <p align="left" class="style2">To redefine the default formatting of a specific HTML tag, select the Tag option and then enter an HTML tag in the Tag text box or select one from the pop?up menu. 

To define the formatting for a particular combination of tags or for all tags that contain a specific Id attribute, select the Advanced option and then enter one or more HTML tags in the Selector text box or select one from the pop?up menu. The selectors (known as pseudo?class selectors) available from the pop?up menu are a:active, a:hover, a:link, and a:visited.

Select the location in which the style will be defined, and then click OK: 
To place the style in a style sheet that is already attached to the document, select the style sheet.

To create an external style sheet, select New Style Sheet File.

To embed the style in the current document, select This Document Only.

In the CSS Rule Definition dialog box, select the style options you want to set for the new CSS rule. For more information, see the next section. 
When you are finished setting style properties, click OK. 
Note: Clicking OK without setting style options results in a new, empty rule.
</p></td>
              </tr>
          </table></td>
          <td width="219" bgcolor="#D2EEFF" class="style2"><table width="218" height="29" border="3" align="right" cellpadding="0" bordercolor="#7DCEFF">

              <tr>
                <td width="215"><div align="left">
                    <script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script>
                  </div>
                    <fb:like-box href="http://www.facebook.com/platform" width="205" show_faces="true" stream="false" header="true"></fb:like-box>
                  &nbsp;</td>
              </tr>
            </table>

            <div align="right"></div></td>
        </tr>
        <tr>
          <td height="33" colspan="3" nowrap="nowrap" background="C:/xampp/htdocs/Dirwebclient/footer1.gif"><div align="center">
            <table width="374" align="center">
              <tr>
                <th class="copyright" scope="row">&copy VISUAL CONCEPT MEDIA 2011</th>
              </tr>

            </table>
          </div></td>
        </tr>
      </table></th>
    </tr>
  </table>
</div>

</body>
</html>

Report · May 25, 2012

>C:/xampp/htdocs/Dirwebclient/banner3A.png

Is that the correct local path to the file?

Report · May 26, 2012

Yeah, exactly