PHP placing image outside table

  • Poly
  • Guru
  • Guru
  • User avatar
  • Posts: 1091
  • Loc: Same place you left me.

Post 3+ Months Ago

So I have a PHP script that is echoing a table. Data is loaded from a MySQL Database and placed inside the table. Once the data is loaded the script checks to see what category the data is for, and loads an image based on the category number. However, when the page loads, it is displaying the image outside the table. I am assuming this has to do with the function being called in the middle of an echo. Is this correct and how can I fix it?

Code: [ Select ]
<?php echo "<table id='tutBar' border='0' cellspacing='0' cellpadding='0'>
 <tr>
  <td rowspan='3' width='51' height='51'>" . tutImg() . "</td>
  <td><strong></td>
    <td><strong>Posted By: </strong>{$row['usr']}</td>
 </tr>
 <tr>
    <td><strong>{$row['name']}</strong></td>
    <td><strong>Posted On: </strong>{$row['date']}</td>
 </tr>
 <tr>
  <td>{$row['sdesc']}</td>
    <td><strong>ID:</strong> {$row['id']} | <strong>Sub-Category:</strong>{$row['subcat']}</td>
 </tr>
</table>
<br />{$row['ldesc']}";?>
  1. <?php echo "<table id='tutBar' border='0' cellspacing='0' cellpadding='0'>
  2.  <tr>
  3.   <td rowspan='3' width='51' height='51'>" . tutImg() . "</td>
  4.   <td><strong></td>
  5.     <td><strong>Posted By: </strong>{$row['usr']}</td>
  6.  </tr>
  7.  <tr>
  8.     <td><strong>{$row['name']}</strong></td>
  9.     <td><strong>Posted On: </strong>{$row['date']}</td>
  10.  </tr>
  11.  <tr>
  12.   <td>{$row['sdesc']}</td>
  13.     <td><strong>ID:</strong> {$row['id']} | <strong>Sub-Category:</strong>{$row['subcat']}</td>
  14.  </tr>
  15. </table>
  16. <br />{$row['ldesc']}";?>
  • Bigwebmaster
  • Site Admin
  • Site Admin
  • User avatar
  • Posts: 9099
  • Loc: Seattle, WA & Phoenix, AZ

Post 3+ Months Ago

I am thinking it may have to do with open tags that were not closed, or did not need to be there. For example, on line #4, you have a strong element open there with no closing tag. I would recommend removing that. By looking at your next row which has two cells, I am almost thinking that is an entire extra td block that you may want to remove.

Let me know if that fixes anything.
  • Poly
  • Guru
  • Guru
  • User avatar
  • Posts: 1091
  • Loc: Same place you left me.

Post 3+ Months Ago

I tried cleaning up the code, but no luck. I did some more digging and I think its related to the function that is loading the image file. When I change my code a bit, and store the image link in the database, it loads it just fine:
Code: [ Select ]
<?php echo "<table id='tutBar' border='0' cellspacing='0' cellpadding='0'>
 <tr>
  <td rowspan='3' id='tutTop'><img src=\"".$row['img']."\"></td>
  <td></td>
    <td><strong>Posted By: </strong>{$row['usr']}</td>
 </tr>
 <tr>
    <td><strong>{$row['name']}</strong></td>
    <td><strong>Posted On: </strong>{$row['date']}</td>
 </tr>
 <tr>
  <td>{$row['sdesc']}</td>
    <td><strong>ID:</strong> {$row['id']} | <strong>Sub-Category:</strong>{$row['subcat']}</td>
 </tr>
</table>
<br />{$row['ldesc']}";?>
  1. <?php echo "<table id='tutBar' border='0' cellspacing='0' cellpadding='0'>
  2.  <tr>
  3.   <td rowspan='3' id='tutTop'><img src=\"".$row['img']."\"></td>
  4.   <td></td>
  5.     <td><strong>Posted By: </strong>{$row['usr']}</td>
  6.  </tr>
  7.  <tr>
  8.     <td><strong>{$row['name']}</strong></td>
  9.     <td><strong>Posted On: </strong>{$row['date']}</td>
  10.  </tr>
  11.  <tr>
  12.   <td>{$row['sdesc']}</td>
  13.     <td><strong>ID:</strong> {$row['id']} | <strong>Sub-Category:</strong>{$row['subcat']}</td>
  14.  </tr>
  15. </table>
  16. <br />{$row['ldesc']}";?>



When I use the function to load the images, it loads it before the table starts. So I'm getting <img><table>.

My database stores a ID for what category the post is in, then the function loads an image based on the category number and displays it. I could modify the insert code so it inserts the image link in the database, based on which category is selected, but I would far prefer to do it through a function.
Code: [ Select ]
function tutImg(){
        $query = "SELECT cat FROM tutorials WHERE id LIKE $id";
        $row = mysql_fetch_array(mysql_query($query));
        
        if($row == "0")
        {
            echo "<img src='img/php.png' />";
        }
        else {
            echo "<img src='img/nif.jpg' />";
        }
    }
  1. function tutImg(){
  2.         $query = "SELECT cat FROM tutorials WHERE id LIKE $id";
  3.         $row = mysql_fetch_array(mysql_query($query));
  4.         
  5.         if($row == "0")
  6.         {
  7.             echo "<img src='img/php.png' />";
  8.         }
  9.         else {
  10.             echo "<img src='img/nif.jpg' />";
  11.         }
  12.     }
  • Bigwebmaster
  • Site Admin
  • Site Admin
  • User avatar
  • Posts: 9099
  • Loc: Seattle, WA & Phoenix, AZ

Post 3+ Months Ago

I see that makes it a bit more clear when have the function shown there. In your function you are echoing the output, which you are correct, that gets displayed immediately. What you should do instead is return that string instead of output it. So the following:

Code: [ Select ]
function tutImg(){
      $query = "SELECT cat FROM tutorials WHERE id LIKE $id";
      $row = mysql_fetch_array(mysql_query($query));
      
      if($row == "0")
      {
        return "<img src='img/php.png' />";
      }
      else {
        return "<img src='img/nif.jpg' />";
      }
    }
  1. function tutImg(){
  2.       $query = "SELECT cat FROM tutorials WHERE id LIKE $id";
  3.       $row = mysql_fetch_array(mysql_query($query));
  4.       
  5.       if($row == "0")
  6.       {
  7.         return "<img src='img/php.png' />";
  8.       }
  9.       else {
  10.         return "<img src='img/nif.jpg' />";
  11.       }
  12.     }


Then in your HTML code (with PHP), you would do the echoing there. So something like this:

PHP Code: [ Select ]
<td rowspan='3' width='51' height='51'>" . echo tutImg() . "</td>


See if that helps :)
  • Bigwebmaster
  • Site Admin
  • Site Admin
  • User avatar
  • Posts: 9099
  • Loc: Seattle, WA & Phoenix, AZ

Post 3+ Months Ago

By the way Poly, just on a side note you don't have to echo all of your HTML content like that with PHP. The one nice thing about PHP is you can separate HTML and your PHP code. So with the above you could do this instead:

PHP Code: [ Select ]
<table id="tutBar" border="0" cellspacing="0" cellpadding="0">
   <tr>
      <td rowspan="3" width="51" height="51"><?php echo tutImg(); ?></td>
      <td><strong>Posted By: </strong><?php echo $row['usr']; ?></td>
   </tr>
   <tr>
      <td><strong><?php echo $row['name']; ?></strong></td>
      <td><strong>Posted On: </strong><?php echo $row['date']; ?></td>
   </tr>
   <tr>
      <td><?php echo $row['sdesc']; ?></td>
      <td><strong>ID:</strong> <?php echo $row['id']; ?> | <strong>Sub-Category:</strong><?php echo $row['subcat']; ?></td>
   </tr>
</table>
<br /><?php echo $row['ldesc']; ?>
  1. <table id="tutBar" border="0" cellspacing="0" cellpadding="0">
  2.    <tr>
  3.       <td rowspan="3" width="51" height="51"><?php echo tutImg(); ?></td>
  4.       <td><strong>Posted By: </strong><?php echo $row['usr']; ?></td>
  5.    </tr>
  6.    <tr>
  7.       <td><strong><?php echo $row['name']; ?></strong></td>
  8.       <td><strong>Posted On: </strong><?php echo $row['date']; ?></td>
  9.    </tr>
  10.    <tr>
  11.       <td><?php echo $row['sdesc']; ?></td>
  12.       <td><strong>ID:</strong> <?php echo $row['id']; ?> | <strong>Sub-Category:</strong><?php echo $row['subcat']; ?></td>
  13.    </tr>
  14. </table>
  15. <br /><?php echo $row['ldesc']; ?>


The above is how I would typically do it so that it makes it easier to use either " (double quote) or ' (single quote) in your code as you don't have to worry about escaping them, and easier to output results from functions. I also think it looks cleaner and is less error prone. Of course you are welcome to use whatever style works for you, but I just thought I would throw that out there in case you did not know you could do it a different way :)
  • Poly
  • Guru
  • Guru
  • User avatar
  • Posts: 1091
  • Loc: Same place you left me.

Post 3+ Months Ago

Thanks BWM. That got it working, its now loading an image in the correct spot, just not the correct image.

In the database, one of the columns is "cat" which is for the category. This is an integer value. The function check what int value is in the database, based of which tutorial ID you clicked on, then loads the appropriate image.

EX: ID: 1, cat: 1, image: php.jpg

This should load the PHP icon. Instead it is loading the No Image Found image(which is the else condition in the function).

Code: [ Select ]
function tutImg(){
        $query = "SELECT cat FROM tutorials WHERE id LIKE $id";
        $row = mysql_fetch_array(mysql_query($query));
        
        if($row == "1")
        {
            return "<img src='img/php.png' />";
        }
        else if($row == "2")
        {
            return "<img src='img/ps.jpg' />";
        }
        else if($row == "3")
        {
            return "<img src='img/asp.jpg' />";
        }
        else if($row == "4")
        {
            return "<img src='img/js.png' />";
        }
        else if($row == "5")
        {
            return "<img src='img/mysql.png' />";
        }
        else {
            return "<img src='img/nif.jpg' />";
        }
    }
  1. function tutImg(){
  2.         $query = "SELECT cat FROM tutorials WHERE id LIKE $id";
  3.         $row = mysql_fetch_array(mysql_query($query));
  4.         
  5.         if($row == "1")
  6.         {
  7.             return "<img src='img/php.png' />";
  8.         }
  9.         else if($row == "2")
  10.         {
  11.             return "<img src='img/ps.jpg' />";
  12.         }
  13.         else if($row == "3")
  14.         {
  15.             return "<img src='img/asp.jpg' />";
  16.         }
  17.         else if($row == "4")
  18.         {
  19.             return "<img src='img/js.png' />";
  20.         }
  21.         else if($row == "5")
  22.         {
  23.             return "<img src='img/mysql.png' />";
  24.         }
  25.         else {
  26.             return "<img src='img/nif.jpg' />";
  27.         }
  28.     }


Basically, all this should do is compare the int in 'cat' to a list, and display the corresponding image. However, regardless of the number in the database, it is loading the else condition.
  • Bigwebmaster
  • Site Admin
  • Site Admin
  • User avatar
  • Posts: 9099
  • Loc: Seattle, WA & Phoenix, AZ

Post 3+ Months Ago

Glad that fixed your other problem!

I think your other problem here is that you are most likely not accessing the return $row array correctly. Before I get to that your query might be more efficient using the equal sign versus LIKE. I would typically only use LIKE if you are just trying to find part of a value in a larger string or something. So with your above query I would change it to:

PHP Code: [ Select ]
$query = "SELECT cat FROM tutorials WHERE id = $id";


Also make sure $id is well sanitized or you could open yourself up to some sort of SQL injection attack on your website.

Back to your actual question when you go:

PHP Code: [ Select ]
$row = mysql_fetch_array(mysql_query($query));


That is storing an entire array in the $row variable. That means that $row is not actually your "cat", its the entire array of values. You should actually probably access it like:

$row['cat']

So with that said everything put together would be:

PHP Code: [ Select ]
function tutImg(){
      $query = "SELECT cat FROM tutorials WHERE id = $id";
      $row = mysql_fetch_array(mysql_query($query));
     
      if($row['cat'] == "1")
      {
         return "<img src='img/php.png' />";
      }
      else if($row['cat'] == "2")
      {
         return "<img src='img/ps.jpg' />";
      }
      else if($row['cat'] == "3")
      {
         return "<img src='img/asp.jpg' />";
      }
      else if($row['cat'] == "4")
      {
         return "<img src='img/js.png' />";
      }
      else if($row['cat'] == "5")
      {
         return "<img src='img/mysql.png' />";
      }
      else {
         return "<img src='img/nif.jpg' />";
      }
   }
  1. function tutImg(){
  2.       $query = "SELECT cat FROM tutorials WHERE id = $id";
  3.       $row = mysql_fetch_array(mysql_query($query));
  4.      
  5.       if($row['cat'] == "1")
  6.       {
  7.          return "<img src='img/php.png' />";
  8.       }
  9.       else if($row['cat'] == "2")
  10.       {
  11.          return "<img src='img/ps.jpg' />";
  12.       }
  13.       else if($row['cat'] == "3")
  14.       {
  15.          return "<img src='img/asp.jpg' />";
  16.       }
  17.       else if($row['cat'] == "4")
  18.       {
  19.          return "<img src='img/js.png' />";
  20.       }
  21.       else if($row['cat'] == "5")
  22.       {
  23.          return "<img src='img/mysql.png' />";
  24.       }
  25.       else {
  26.          return "<img src='img/nif.jpg' />";
  27.       }
  28.    }


Also you could even simplifier this much more if you would store the image name in your database as a new field with all of your data. This would also make it much easier to add new categories down the road. Let's say in your database you had these fields for your tutorials table:

id
cat
image

Then you could do this instead:

PHP Code: [ Select ]
function tutImg(){
      $query = "SELECT cat, image FROM tutorials WHERE id = $id";
      $row = mysql_fetch_array(mysql_query($query));
     
      return "<img src='img/" . $row['image'] . "' />";
   }
  1. function tutImg(){
  2.       $query = "SELECT cat, image FROM tutorials WHERE id = $id";
  3.       $row = mysql_fetch_array(mysql_query($query));
  4.      
  5.       return "<img src='img/" . $row['image'] . "' />";
  6.    }


Hopefully something there helps you :)
  • Poly
  • Guru
  • Guru
  • User avatar
  • Posts: 1091
  • Loc: Same place you left me.

Post 3+ Months Ago

I added the image field into the database, and attempted to load it using the function, but instead of loading the image, it is outputting <img src='' />. I also tried the other option you suggested, but it still results in it defaulting to the else condition(nif.jpg). I also updated to the = instead of LIKE. Any ideas good sir?
  • Bigwebmaster
  • Site Admin
  • Site Admin
  • User avatar
  • Posts: 9099
  • Loc: Seattle, WA & Phoenix, AZ

Post 3+ Months Ago

Can you go into something such as phpMyAdmin and run a query that looks like this:

SQL Code: [ Select ]
SELECT cat, image FROM tutorials WHERE id = 3


See if that at least is returning results. If it is then in your PHP file right after this line:

PHP Code: [ Select ]
$row = mysql_fetch_array(mysql_query($query));


Type in this:

PHP Code: [ Select ]
print_r($row);
exit;
  1. print_r($row);
  2. exit;


and let me know what the results are.
  • Poly
  • Guru
  • Guru
  • User avatar
  • Posts: 1091
  • Loc: Same place you left me.

Post 3+ Months Ago

Code: [ Select ]
SELECT cat, image FROM tutorials WHERE id = 3

Generated the SQL code as you would expect. It loaded the cat and image fields from the row with the ID of 3.

Adding
Code: [ Select ]
print_r($row);
exit;
  1. print_r($row);
  2. exit;

returned nothing. It ended the HTML, and generated nothing else.
  • Bigwebmaster
  • Site Admin
  • Site Admin
  • User avatar
  • Posts: 9099
  • Loc: Seattle, WA & Phoenix, AZ

Post 3+ Months Ago

That shows that the problem is with this line then:

PHP Code: [ Select ]
$row = mysql_fetch_array(mysql_query($query));


Are you sure you are connected to a database correctly?

Could you also do a:

PHP Code: [ Select ]
echo $query;


right after the spot where you set the query string. I would be curious to what the actual SQL query that gets set is. Maybe its possible $id is not being set.
  • Poly
  • Guru
  • Guru
  • User avatar
  • Posts: 1091
  • Loc: Same place you left me.

Post 3+ Months Ago

Bingo. The $id is not being set. When I echo the query, its outputting
Code: [ Select ]
SELECT cat, img FROM tutorials WHERE id =


I am loading the function from function.php, which is the second thing to get loaded on the page, after the database connection is made.
Code: [ Select ]
//Load the functions
  include_once ('function.php');
  1. //Load the functions
  2.   include_once ('function.php');
  • Bigwebmaster
  • Site Admin
  • Site Admin
  • User avatar
  • Posts: 9099
  • Loc: Seattle, WA & Phoenix, AZ

Post 3+ Months Ago

I am guessing that you probably have the $id set somewhere out side of that function. Typically what you would do is start the function like this:

PHP Code: [ Select ]
function tutImg($id){


and then when you call the function you would do something like this:

PHP Code: [ Select ]
<?php echo tutImg($someid); ?>


That would be the preferred way. A more sloppy/lazy way would be to just declare the $id as global in the function and then it would access it outside. So you would do someting like this instead:

PHP Code: [ Select ]
function tutImg(){
global $id;
  1. function tutImg(){
  2. global $id;


and then the $id should actually contain a value if you have it set somewhere in your application before you called that function. Remember when your write functions all variables are local to that function and cannot access anything outside of that function unless they have a global scope.
  • Poly
  • Guru
  • Guru
  • User avatar
  • Posts: 1091
  • Loc: Same place you left me.

Post 3+ Months Ago

Thanks, that got it sorted out!
  • Bigwebmaster
  • Site Admin
  • Site Admin
  • User avatar
  • Posts: 9099
  • Loc: Seattle, WA & Phoenix, AZ

Post 3+ Months Ago

Glad it finally all works :)

Post Information

  • Total Posts in this topic: 15 posts
  • Users browsing this forum: No registered users and 47 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.