View Single Post
Old 02-20-2013, 07:15 PM's Avatar is offline
Join Date: Feb 2013
Posts: 1
Question Hide second option when there is no available variation

I have a product that has 2 sets of options. A diameter and length. The issue that I'm running into is that some of the diameters aren't available in certain lengths. For example, a 5mm diameter rope is available in 25, 50, 100, & 500 foot lengths. While a 25 mm diameter rope is available in 25, 50, 100, & 250 foot lengths.

We have technically infinite stock of the products, but I've added a large quantity as Lana indicated in this thread. Now at least when a variation that doesn't exist is selected, the add to bag button is hidden and "Out of Stock" appears for that combo.

I'm concerned that customer will interpret this to mean that we will eventually have stock for that variation of diameter and length, which isn't the case. What I'd like to do is disable the appropriate length radio buttons depending on which diameter is selected. I've found this post by smoothsailingclothing that seemed to be heading in the right direction.

Ecwid.OnPageLoaded.add(function(page) {
   if ( page.type == "PRODUCT" ) {
            url:'' + page.productId,
            dataType: 'jsonp',
                $.each(json.variations, function(index, product) {
                     if ( product.quantity == 0 ) {
                        $("#ecwid-productoption-" + page.productId + "-Size option:eq(" + index + ")").attr("disabled","disabled");
                        if ( (index+1) != json.variations.length ) {
                            $("#ecwid-productoption-" + page.productId + "-Size").val(index+1).trigger('change');
Unfortunately, the output from json.variations doesn't include empty variations. So I think that code is a dead end for me. All I can think of is to pull all the length radio buttons that generate a price of $0.00, then disable them, but I can't think of how to accomplish that through the api.

Has anyone had any success with this?