Question

Have a table with a list of items in each row concat together in a PHP select.

Test image of what I have at the moment.

As seen the job description, price each and quantity columns have different items concat together with a line break in between each item. The problem I have now found is that if a job description is to long it goes onto the next line mucking up being in line with the price each and quantity columns.

I have tried numerous nested tables, but all end up being to messy and spoiling the odd even CSS I have at the moment. So I keep coming back to the code below.

My select:

"SELECT DATE_FORMAT(`$quotedate`, '%d-%m-%Y') AS `$quotedate`, `$quoteno`, 
   `$customer`, `$contactname`, CONCAT_WS('\r\r', `$jobdescription1`, 
   `$jobdescription2`, `$jobdescription3`, `$jobdescription4`, `$jobdescription5`,
   `$jobdescription6`, `$jobdescription7`, `$jobdescription8`, `$jobdescription9`,
   `$jobdescription10`) AS `Job Description`, 
    CONCAT_WS('\r\r £', concat('£', `$priceeach1`), `$priceeach2`, `$priceeach3`, 
   `$priceeach4`, `$priceeach5`, `$priceeach6`, `$priceeach7`, `$priceeach8`, 
   `$priceeach9`, `$priceeach10`) AS `Price Each`, 
   CONCAT_WS('\r\r', `$quantity1`, `$quantity2`, `$quantity3`, `$quantity4`,
   `$quantity5`, `$quantity6`, `$quantity7`, `$quantity8`, `$quantity9`, `$quantity10`) 
   AS`Quantity`  
FROM {$table} 
WHERE `$status`=0 $search ORDER BY {$table}.`$quotedate` asc";

And table:

echo "<table id=\"quote_table\"><tr>";
for($i=0; $i<$fields_num; $i++){
$field = mysql_fetch_field($result);
echo "<th>{$field->name}</th>";
}
echo "</tr>";

while($row = mysql_fetch_row($result)){
echo "<tr id=\"data\">";

foreach($row as $cell)
echo nl2br ("<td>$cell</td>");

echo "</tr>";
}

Does anyone have any ideas how I could get around this.
Thanks

Solution
I used a slightly modified version of bmewsing’s answer.
So I used a select with no formatting. Then put it in a table with the following:

while($row = mysql_fetch_array($result))
{
BuildRow($row[$quotedate], $row[$quoteno], $row[$customer], $row[$contactname], 
       $row[$jobdescription1], "£" . $row[$priceeach1], $row[$quantity1]);

if($row[$jobdescription2]){ BuildRow2("", "", "", "", $row[$jobdescription2], "£" . $row[$priceeach2], $row[$quantity2]);}
if($row[$jobdescription3]){ BuildRow2("", "", "", "", $row[$jobdescription3], "£" . $row[$priceeach3], $row[$quantity3]);}
if($row[$jobdescription4]){ BuildRow2("", "", "", "", $row[$jobdescription4], "£" . $row[$priceeach4], $row[$quantity4]);}
if($row[$jobdescription5]){ BuildRow2("", "", "", "", $row[$jobdescription5], "£" . $row[$priceeach5], $row[$quantity5]);}
if($row[$jobdescription6]){ BuildRow2("", "", "", "", $row[$jobdescription6], "£" . $row[$priceeach6], $row[$quantity6]);}
if($row[$jobdescription7]){ BuildRow2("", "", "", "", $row[$jobdescription7], "£" . $row[$priceeach7], $row[$quantity7]);}
if($row[$jobdescription8]){ BuildRow2("", "", "", "", $row[$jobdescription8], "£" . $row[$priceeach8], $row[$quantity8]);}
if($row[$jobdescription9]){ BuildRow2("", "", "", "", $row[$jobdescription9], "£" . $row[$priceeach9], $row[$quantity9]);}
if($row[$jobdescription10]){ BuildRow2("", "", "", "", $row[$jobdescription10], "£" . $row[$priceeach10], $row[$quantity10]);}

}

function BuildRow($qdate, $qno, $cust, $cname, $jobdesc, $priceea, $qty){

if($qdate || $qno || $cust || $cname || $jobdesc || $priceea || $qty) {
echo "<tr class=\"top\">";
echo "<td>$qdate</td>";
echo "<td>$qno</td>";
echo "<td>$cust</td>";
echo "<td>$cname</td>";
echo "<td>$jobdesc</td>";
echo "<td>$priceea</td>";
echo "<td>$qty</td>";
echo "<tr/>";
}
}
function BuildRow2($qdate2, $qno2, $cust2, $cname2, $jobdesc2, $priceea2, $qty2){
if($qdate2 || $qno2 || $cust2 || $cname2 || $jobdesc2 || $priceea2 || $qty2) {
echo "<tr class=\"middle\">";
echo "<td>$qdate2</td>";
echo "<td>$qno2</td>";
echo "<td>$cust2</td>";
echo "<td>$cname2</td>";
echo "<td>$jobdesc2</td>";
echo "<td>$priceea2</td>";
echo "<td>$qty2</td>";
echo "<tr/>";
}
}  

Then used jQuery to add an ‘odd’ or ‘even’ class to the middle class depending on which the previous ‘top’ class has.

$(document).ready(function(){
$("#quote_table > tbody > tr.top:even").addClass("even");
$("#quote_table > tbody > tr.top:odd").addClass("odd");

$('.middle').each(function(){
var quote_class = $(this).prevUntil(".top").prev(".top").attr("class");
$(this).addClass(quote_class);
$(this).removeClass("top");
});

I then put:

$('tr.middle').hover(function(){
$(this).prevUntil(".top").nextUntil(".top").andSelf().prev().addClass("hover");},
function(){
$(this).prevUntil(".top").nextUntil(".top").andSelf().prev().removeClass("hover");
});

$('tr.top').hover(function(){
$(this).nextUntil(".top").andSelf().not('#add').addClass("hover");},
function(){
$(this).nextUntil(".top").andSelf().removeClass("hover");
});

So that each “block” would highlight when the mouse moved over part of it.

I only got the finished solution through trial and error, so there may be a better way.
But it works!

Answer 1

Don’t do formatting in your SQL query (no line breaks or concat). Select the individual attributes then build your table. A row for each description, price, qty set.

for($i=0; $i<$fields_num; $i++){
$field = mysql_fetch_field($result);
echo "<th>{$field->name}</th>";
}
echo "</tr>";

while($row = mysql_fetch_row($result)){

 //build date, number, customer, name and the first
 //job description, price and qty
 BuildRow($row[$quotedate], $row[$quoteno], $row[$customer], $row[$contactname], 
           $row[$jobdescription1], "£" . $row[$priceeach1], $row[$quantity1]);
 //now build a row/cells for each of the
 //additional description, price, qty in the result row.
 BuildRow("", "", "", "", $row[$jobdescription2], $row[$priceeach2], $row[$quantity2]);
 //etc...
}

function BuildRow($date, $num, $cust, $name, $descrip, $price, $qty){
 //don't build if empty
 if($date || $num || $cust || $name || $descrip || $price || $qty) {
   echo "<tr >";
   echo "<td>$date</td>";
   //etc...
   echo "</tr>";
 }
}

With some styling you should then be able to get it to look like a “block” for each quote.