multi-product displays with a table instead of select


I am building a multi-product display. Its working pretty well, but I would like to be able to use a table instead of a select to show each referenced product with an Add to card button. Or even list of all referenced products would be better. I think my users will be confused about the having to choose from a drop down.

I am thinking that I have to alter the render array to get it to build list or table markup instead of Select markup.

Can anyone point me at some examples or give me some suggestions?



Posted: Oct 7, 2011


toddgeist on October 7, 2011

Is there anyway to display the associated products on the Display_Type with a list view of some kind. Either a table or a list.

Something like

Add To Cart

Add To Cart2

This would be very helpful!



taylor on October 9, 2011

I'm currently attempting to implement this functionality. I've found that Views can achieve this (to a certain extent). The main obstacle for me now is a single add to cart button to add multiple products to the cart at the same time.

I'm not sure the best way to display the View, maybe using Panels to override the node display?

Basic Instructions:
1) Add a new view with: Show content of type .... (I set mine up as a block).
2) Ensure the Views format is Table.
3) In the advanced section of the views editor add a relationship Content: Referenced product.
4) You'll now be able to add the product entity information as fields. Add these as needed.
5) Add a contextual filter Content: Nid. On the configuration screen that follows, under "WHEN THE FILTER VALUE IS NOT AVAILABLE" select Provide default value with the type Content ID from URL.

The last step is to only display the products that are referenced to the particular display node the user is viewing.

I realise my explanation is lacking and that it isn't even a fully finished solution. While it does allow the basic table layout, the inability to add multiple products to the cart at the same time isn't intuitive. I've attached 2 screenshots to go along with my poor explanation! I'll report back if I find a better way to do this or work out the cart functionality.

amorales on October 16, 2012


I've found this post after a long time looking for a solution for a similar problem.

I'm trying to show a display product with an add to cart in a table instead of a list box.

What I've done is to create a View in a Table format like Taylor says in the previous comment, with the product variations fields an a add to cart button for each product variation.

The way I've resoved the integration with the product display is by using the Viewfield Module and configuring it to show the view created previously.

The problem I've found doing this is that an anonymous user can`t see the table with the referenced view. I solved this by giving "View any type of products" permisson to all roles.

mengi on December 19, 2012

Thank you for posting how to do this. Just what I needed.

As a suggestion; Instead of having a add to cart button for every product, try the add to cart module (http://drupal.org/project/commerce_add_to_cart_extras). Then there is a single add to cart button at the button of the table and each product has a quantity field, which allows a user to add multiple products in one click.

To use this module, go to the view and add a field, its called Quantity input field Quantity.