views:

20

answers:

2

Most of the time it makes sense to organize table data in rows. However right now I'm dealing with a table that compares data across several columns. Each column is a product, so I'd like to keep all product data grouped together.

<tr> 
  <td>Name</td>
  <td>Price</td>
  <td>Weight</td>
  <td>Height</td>
  <td>Compatibility</td>
  <td>Designer</td>
  <td>Manufacturer</td>
  <td>Age Requirement</td>
</tr>

Using the TR tag that row will run horizontally, is there a way to make it run vertically?

Update: I would like the table to display like regular html in this example:

<tr>  
  <td>Name</td> 
  <td>Name2</td> 
</tr>  
<tr>  
  <td>Price</td> 
  <td>Price2</td> 
</tr>  
<tr>  
  <td>Weight</td> 
  <td>Weight2</td> 
</tr>  
<tr>  
  <td>Height</td> 
  <td>Height2</td> 
</tr>  

However I would like to be able to code it by related content:

<tr>  
  <td>Name</td> 
  <td>Price</td> 
  <td>Weight</td> 
  <td>Height</td> 
</tr>  

<tr>  
  <td>Name</td> 
  <td>Price</td> 
  <td>Weight</td> 
  <td>Height</td> 
</tr> 

In other words, I want the table row tag (tr) to act like a column.

+1  A: 
<tr>  
  <td>Name</td> 
</tr>  
<tr>  
  <td>Price</td> 
</tr>  
<tr>  
  <td>Weight</td> 
</tr>  
<tr>  
  <td>Height</td> 
</tr>  
<tr>  
  <td>Compatibility</td> 
</tr>  
<tr>  
  <td>Designer</td> 
</tr>  
<tr>  
  <td>Manufacturer</td> 
</tr>  
<tr>  
  <td>Age Requirement</td> 
</tr> 

If you want another product beside it, you would do:

<tr>  
  <td>Name</td> 
  <td>Name2</td> 
</tr>  
<tr>  
  <td>Price</td> 
  <td>Price2</td> 
</tr>  
<tr>  
  <td>Weight</td> 
  <td>Weight2</td> 
</tr>  
<tr>  
  <td>Height</td> 
  <td>Height2</td> 
</tr>  
<tr>  
  <td>Compatibility</td> 
  <td>Compatibility2</td> 
</tr>  
<tr>  
  <td>Designer</td> 
  <td>Designer2</td> 
</tr>  
<tr>  
  <td>Manufacturer</td> 
  <td>Manufacturer2</td> 
</tr>  
<tr>  
  <td>Age Requirement</td> 
  <td>Age Requirement2</td> 
</tr> 
RedFilter
The issue with that is when there are 4 columns. It's still grouping by row.
Phil
@Phil: see my update.
RedFilter
I've thought about just using multiple tables, but that won't work because if a comparison row item is multiple lines and its counterparts are single line we'll run into alignment issues unless we force each cell height.
Phil
Right, but I want to group by item data, not use the traditional rows...
Phil
I'm not following, can you provide sample output?
RedFilter
see updated question.
Phil
When you say "grouping" do you mean you want the HTML for a product to be together? If so, not sure why that matters...
RedFilter
Yes. I'd like all the data to be together. I'm going to be placing ajax calls to update columns, it'll would be really nice have all the data in one place.This is a case of #lazyweb
Phil
In this case I would return `JSON` data rather than `HTML`, and then it is easy client-side to update the rows accordingly.
RedFilter
but then I have to map all the objects... *grumble* Thanks for your help!
Phil
A: 

Have you tried pivoting your data first? If you pivot your data first then you don't have to alter the way your html is output.

subt13
Yes, I wish that was an option :)
Phil