I'm using Drupal Commerce with Commerce Product Option module. Design goal is to have a visual product configurator - an area on the Add 2 Cart Form where product images update as the user selects individual line item options.

NOTE: The product is custom furniture and the Product Options are fabric finish, wood, cushion, etc. Consequently the universe of options is large, so having an individual SKUs and images for each possible product configuration is not practical. Hence Commerce Product Option.

So far I've implemented a semi-successful solution that uses jQuery to (A) modify the line item form to add jQuery modal dialog and product display area, and (B) add handlers to form elements. This javascript is attached to the form via a custom module, hook_form_alter() and $form['#attached']['js'].

The problem I'm having is with the Product Display form, which provides the user a SELECT list (ID=edit-product-id) to choose furniture configuration for a particular family of furniture (4 seat sofa, 3 seat sofa, loveseat, etc.). Upon initial display everything works, however if the user selects another configuration the javascript is run a second time (well actually four more times - which I assume is associated with the number of line options).

I'm seeking ideas on how to resolve this issue. Thanks in advance.

Chris