Drupal Commerce Alpha 3

This last week's development on Drupal Commerce has been a flurry of exciting commits for me. Ever since the first demos I've been talking about how the Add to Cart form will be able to use field data to let customers choose products by their field values instead of their titles. Similarly, I've talked about dynamically updating field data on the page so images, prices, and other fields are re-rendered to reflect the currently selected product.

Until now these features have been relatively low priority, as we focused on the other major core systems. However, with the release of 7.x-1.0-alpha3, they have finally moved from the hypothetical realm into code awaiting your testing.

Example Add to Cart form
Inherited product fields, dynamic options, and dependent attributes... oh my!

The screenshot shows three features of Drupal Commerce product displays:

  1. Product fields from the default product are pulled into the node display via the Product Reference field. The pictured display actually references 12 separate products representing different color / size combinations.
  2. The Add to Cart form display formatter turns product reference fields into forms. It creates attribute select lists using field data from the referenced products, only including options that actually exist on products referenced by the field.
  3. As options are selected on the form, the product fields displayed on the page are updated to reflect the currently selected product. The options on the form also update to show newly available options, allowing for attribute dependencies to any depth in their order of appearance on the form.

In other words, as I choose a color option, the size select list updates to only list sizes of the shirt available in that color and the image can change to show me wearing a different shirt. If the size is changed to a more expensive option, the price on the page updates accordingly. I'm sure this description hardly does the features justice, so I'll get a screencast and live demo up next week for you to play with.

This behavior is all thanks to the new #ajax property in Drupal 7 and required no custom JavaScript to work. When a select list's value changes, the form is submitted and rebuilt server side giving me a chance to change the available options. My #ajax callback uses a set of AJAX commands to direct the replacement of the existing form with the newly rebuilt form and works alongside the product reference field to re-render and replace any product fields on the page as necessary.

(On a side note, if you need to do full form replacement yourself, be sure not to target the form using its id. Each time it is rebuilt, the HTML id is incremented by drupal_html_id(), so the replacement will only work the first time. Instead, either target a container within the form or some other selector that won't change each refresh. This cost me a few hours. )

Other features of note in this release include:

  • The order edit form has taken shape with vertical tabs, revision logging, and working customer profile reference fields.
  • All currencies have been defined with updates to the Price field accommodating multi-currency stores. Currency rounding now accommodates currencies like Swiss Francs, which rounds to the nearest twentieth (thanks to das-peter). Only known currency formats are implemented, so you may need to open an issue for yours to have proper formatting (i.e. $100.00 vs. 100.00 USD).
  • The Payment module received more work since the last release to support credit card payment methods. I've created Commerce Authorize.Net as a proof-of-concept and example implementation for other developers to follow. (Some code specific to that module right now will be abstracted to Payment, like a general handler for prior authorization captures.)

More information and a full commit log are available in the release notes. I'm very grateful for the efforts of community contributors, especially das-peter for his help on the currency issues and our Entity API and Rules integration.

There's still plenty of work to be done, so feel free to join is in the issue queue.

Topics: 

Comments

Congratulations! I remember thinking attributes were so limited in Ubercart and now you've gone and made them not only dynamically update but also given them a rules system!

Simply superb work!

I'm just in the middle of starting an ecommerce site (using Ubercart right now) and the whole attributes thing is rather messy. And not to mention stock control... So I'm looking forward to the time when all the Drupal 7 goodies have release candidates.

If I ever have any free time after my site's ready, I'll try to have a play about with the alphas on a local installation.

Is there a nice backend tool for managing the stock level of attributes? Ubercart is utterly failing on this point for me.

Great work! I am excited to see the administration area.

Is the prefix/suffix per product or per attribute/combo?

Hi

We gave a previous version of Drupal commerce a go, it wasn't flexible enough for us so in the end we opted to go for a different ecommerce solution. Will try the new improved version, which is a few versions later from the one we tried - fingers crossed.

photo mugs

Hello,

i'm in the process of building a e-commerce website with many products and attributes,
acctually pretty much a clone of this site:

http://www.koziol-shop.co.uk/

i'm not sure if I should use ubercart with d6 or DC, i'm leaning towards the DC because I want the website to have the newest features and I think this is the way to go.

do you you have the screencast for the attributes setup? As I really want to understand how to setup products with multiple colors and images.

Thanks

Idan