Populate HTML table with MySQL data (multiple images for a table cell)

Question

I am trying to populate HTML table with the data comes from my database. Here I have stored "services" in my table. Each service may have multiple images. So when populating the table it should have 3 table cells one for "service name" and second for "description" and third one for images.

This is my SQL query looks like:

$prep_stmt = " SELECT s.id
                    , s.name
                    , s.description
                    , i.image
                    , i.image_path
                FROM  services s
                LEFT JOIN images i ON i.service_id = s.id";

This is how my while look like this:

while ($stmt->fetch()) {        
    $html  = "<tr>\n";  
    $html .= "  <td><input type='checkbox'></td>\n";    
    $html .= "  <td>\n";    
    $html .= "      <a href='' class='name'>{$name}</a>\n";     
    $html .= "  </td>\n";   
    $html .= "  <td class='view_html'>{$description}</td>\n";   
    $html .= "  <td>\n";    
                --- My images should be display here ---- 
    $html .= "  </td>\n";   
    $html .= "</tr>\n";                 

    //Add output to array
    $output[] = $html;  
}

My problem is How I display multiple images in one table cell? If one service have only one image then I can do it, but it has multiple images then I am not sure how to do it.

Answer 1

Change your sql code as below and try

 $prep_stmt = " SELECT s.id
                    , s.name
                    , s.description
                    , (select group_concat(i.image_path,'/',i.image)  from images i where i.service_id = s.id) as img
                FROM  services s";

Then use this Html code

    while ($stmt->fetch()) {        
    $html  = "<tr>";  
    $html .= "  <td><input type='checkbox'></td>";    
    $html .= "  <td>";    
    $html .= "     <a href='' class='name'>{$name}</a>";     
    $html .= "  </td>";   
    $html .= "  <td class='view_html'>{$description}</td>";   

    $html .= "  <td>";
    $img_array=explode(",",$img);
    foreach($img_array as $im){
        if($im==''){
         $html .= " <img src='default.jpg'>";   
        }else{
         $html .= " <img src='{$im}'>";   
        }
    }
    $html .= "  </td>";

    $html .= "</tr>";                 

    //Add output to array
    $output[] = $html;  
}