Tricky Stash table styling task

I have a matrix field which outputs a series of prices for a tour. An image probably illustrates most easily what I'm doing and need to do.

Tricky Stash table styling task

Where the ticket title is repeated in subsequent rows, it needs to be hidden and also a rowspan applied so the number of rows with the same ticket title would need to be counted.

Same with the type in the 2nd column. And they also need to be grouped by background-color.

{exp:stash:set_list   context="@URI"   name="prices"   parse_tags="yes"   parse_depth="1"   trim="yes"   save="yes"   refresh="1440"   replace="no"   scope="site" }   {tour-tickets}      {stash:type}{tour-ticket-accomm-type}{/stash:type}     {stash:min}{tour-ticket-accomm-min-pax}{/stash:min}     {stash:max}{tour-ticket-accomm-capacity}{/stash:max}     {stash:title}{tour-ticket-title}{/stash:title}     {stash:price}{tour-ticket-price}{/stash:price}     {stash:special}{tour-ticket-price-special}{/stash:special}     {stash:peak}{tour-ticket-price-peak}{/stash:peak}     {stash:special-peak}{tour-ticket-price-special-peak}{/stash:special-peak}     {stash:details}{tour-ticket-details}{/stash:details}    {/tour-tickets} {/exp:stash:set_list}  <table>   <thead>     <tr>       <th scope="col">Ticket</th>       <th scope="col">Type</th>       <th scope="col">Details</th>       <th scope="col">Price</th>     </tr>   </thead>   <tbody>     {exp:stash:get_list       name="prices"       context="@URI"       orderby="title|price|special|details|type"       prefix="price"     }       <tr>         <td>{price:title}</td>         <td>{price:type} <br>(Min booking: {price:min}, Sleeps: {price:max})</td>         <td>{price:details}</td>         <td>{price:peak}</td>       </tr>     {/exp:stash:get_list}    </tbody> </table> 

This is what I have so far as shown in the first table. Anyone have any ideas about how to achieve the presentation in the 2nd table?


Category: stash Time: 2016-07-29 Views: 0
Tags: stash

Related post

iOS development

Android development

Python development

JAVA development

Development language

PHP development

Ruby development


Front-end development


development tools

Open Platform

Javascript development

.NET development

cloud computing


Copyright (C), All Rights Reserved.

processed in 0.225 (s). 12 q(s)