Something changed when the upgrade to 10.01.02 - Miva Merchant Community Forums

If this is your first visit, be sure to check out the FAQ by clicking the link above. You may have to register before you can post: click the register link above to proceed. To start viewing messages, select the forum that you want to visit from the selection below.

X

Matt Zimmermann replied

11-23-21, 09:36 AM
Hi Leslie,

For the "Select One" option, I would suggest something like this:

Code:

<option value="">Select One</option>
Leave a comment:

lesliekirk replied

11-23-21, 09:31 AM

Originally posted by lesliekirk View Post

Yes, but I discovered that there is also a hard coded <option>Select One</option>

Which I should note, doesn't seem to want to work all the time.

Here's the Product Attribute Template code:

Code:

<mvt:foreach iterator="attribute" array="attributes">
<mvt:assign name="l.settings:attributeID" value="'l-' $ tolower(l.settings:attribute:code)" />
<input type="hidden" name="Product_Attributes[&mvte:attribute:index;]:code" value="&mvte:attribute:code;" data-attribute-type="&mvte:attribute:type;" />
<mvt:if expr="l.settings:attribute:template_code NE 0">
<input type="hidden" name="Product_Attributes[&mvte:attribute:index;]:template_code" value="&mvte:attribute:template_code;" />
</mvt:if>
<mvt:if expr="l.settings:attribute:type EQ 'text'">
<div class="form-row">
<mvt:if expr="l.settings:attribute:required">
<label for="&mvt:attributeID;" title="&mvte:attribute:prompt;" class="required">&mvte:attribute:prompt;</label>
<mvt:else>
<label for="&mvt:attributeID;" title="&mvte:attribute:prompt;">&mvte:attribute:pr ompt;</label>
</mvt:if>
<input type="text" name="Product_Attributes[&mvte:attribute:index;]:value" value="&mvte:attribute:value;" id="&mvt:attributeID;" class="border--gray" data-attribute="&mvte:attribute:code;" data-option-price="&mvt:attribute:price;" data-regular-price="" />
</div>
<mvt:elseif expr="l.settings:attribute:type EQ 'memo'">
<div class="form-row">
<mvt:if expr="l.settings:attribute:required">
<label for="&mvt:attributeID;" title="&mvte:attribute:prompt;" class="required">&mvte:attribute:prompt;</label>
<mvt:else>
<label for="&mvt:attributeID;" title="&mvte:attribute:prompt;">&mvte:attribute:pr ompt;</label>
</mvt:if>
<textarea name="Product_Attributes[&mvt:attribute:index;]:value" id="&mvt:attributeID;" class="border--gray" data-attribute="&mvte:attribute:code;" data-option-price="&mvt:attribute:price;" data-regular-price="">&mvte:attribute:value;</textarea>
</div>
<mvt:elseif expr="l.settings:attribute:type EQ 'radio'">
<div class="form-row">
<mvt:if expr="l.settings:attribute:required">
<legend for="&mvt:attributeID;" title="&mvte:attribute:prompt;" class="h-nm required">&mvte:attribute:prompt;</legend>
<mvt:else>
<legend for="&mvt:attributeID;" title="&mvte:attribute:prompt;" class="h-nm font--regular">&mvte:attribute:prompt;</legend>
</mvt:if>
<mvt:foreach iterator="option" array="attribute:options">
<mvt:assign name="l.settings:optionID" value="'l-' $ tolower(l.settings:option:code)" />
<label for="&mvt:optionID;" title="&mvt:option:prompt;" class="show">
<mvt:if expr="((g.Product_Attributes[l.settings:attribute:index]:value EQ 0) AND (l.settings:option:id EQ l.settings:attribute:default_id)) OR (g.Product_Attributes[l.settings:attribute:index]:value EQ l.settings:option:code)">
<input type="radio" name="Product_Attributes[&mvte:attribute:index;]:value" value="&mvte:option:code;" id="&mvt:optionID;" data-attribute="&mvte:attribute:code;" data-option-price="&mvt:option:price;" data-regular-price="" checked />
<mvt:else>
<input type="radio" name="Product_Attributes[&mvte:attribute:index;]:value" value="&mvte:option:code;" id="&mvt:optionID;" data-attribute="&mvte:attribute:code;" data-option-price="&mvt:option:price;" data-regular-price="" />
</mvt:if>
<mvt:if expr="l.settings:option:image">
<img src="&mvte:option:image;" alt="&mvte:option:prompt;" title="&mvte:option:prompt;" />
<mvt:else>
&mvte:option:prompt;
<mvt:if expr="l.settings:option:price">
<mvt:if expr="l.settings:option:price GT 0">
&nbsp;<mvt:eval expr="'+ $' $ rnd(l.settings:option:price, 2)" />
<mvt:else>
&nbsp;<mvt:eval expr="'- $' $ rnd(l.settings:option:price, 2)" />
</mvt:if>
</mvt:if>
</mvt:if>
</label>
</mvt:foreach>
</div>
<mvt:elseif expr="l.settings:attribute:type EQ 'select'">
<div class="form-row">
<mvt:if expr="l.settings:attribute:required">
<label for="&mvt:attributeID;" title="&mvt:attribute:prompt;" class="required">&mvt:attribute:prompt;</label>
<mvt:else>
<label for="&mvt:attributeID;" title="&mvt:attribute:prompt;">&mvt:attribute:prompt;</label>
</mvt:if>
<select name="Product_Attributes[&mvt:attribute:index;]:value" id="&mvt:attributeID;" class="border--gray" data-attribute="&mvte:attribute:code;">
<option value="Select One">Select One</option>
<mvt:foreach iterator="option" array="attribute:options">
<mvt:if expr="((g.Product_Attributes[l.settings:attribute:index]:value EQ 0) AND (l.settings:option:id EQ l.settings:attribute:default_id)) OR (g.Product_Attributes[l.settings:attribute:index]:value EQ l.settings:option:code)">
<option value="&mvte:option:code;" data-option-price="&mvt:option:price;" data-regular-price="" selected>
&mvte:option:prompt;
</option>
<mvt:else>
<option value="&mvte:option:code;" data-option-price="&mvt:option:price;" data-regular-price="">
&mvte:option:prompt;
</option>
</mvt:if>
</mvt:foreach>
</select>
</div>
<mvt:elseif expr="l.settings:attribute:type EQ 'swatch-select'">
<div class="form-row cmp-product-purchase__swatch-attribute">
<mvt:if expr="l.settings:attribute:required">
<label for="l-swatch-select" title="&mvt:attribute:prompt;" class="required">&mvt:attribute:prompt; <span class="font--light" data-hook="swatch-name">&nbsp;</span></label>
<mvt:else>
<label for="l-swatch-select" title="&mvt:attribute:prompt;">&mvt:attribute:prom pt; <span class="font--light" data-hook="swatch-name">&nbsp;</span></label>
</mvt:if>
<select id="l-swatch-select" class="h-all-hidden" data-attribute="&mvte:attribute:code;" data-hook="swatch-select" name="Product_Attributes[&mvt:attribute:index;]:value">
<mvt:foreach iterator="option" array="attribute:options">
<mvt:if expr="((g.Product_Attributes[l.settings:attribute:index]:value EQ 0) AND (l.settings:option:id EQ l.settings:attribute:default_id)) OR (g.Product_Attributes[l.settings:attribute:index]:value EQ l.settings:option:code)">
<option value="&mvte:option:code;" data-option-price="&mvt:option:price;" data-regular-price="" selected>
&mvte:option:prompt;
<mvt:if expr="l.settings:option:price">
<mvt:if expr="l.settings:option:price GT 0">
&nbsp;<mvt:eval expr="' +$' $ rnd(l.settings:option:price, 2)" />
<mvt:else>
&nbsp;<mvt:eval expr="' -$' $ rnd(l.settings:option:price, 2)" />
</mvt:if>
</mvt:if>
</option>
<mvt:else>
<option value="&mvte:option:code;" data-option-price="&mvt:option:price;" data-regular-price="">
&mvte:option:prompt;
<mvt:if expr="l.settings:option:price">
<mvt:if expr="l.settings:option:price GT 0">
&nbsp;<mvt:eval expr="' +$' $ rnd(l.settings:option:price, 2)" />
<mvt:else>
&nbsp;<mvt:eval expr="' -$' $ rnd(l.settings:option:price, 2)" />
</mvt:if>
</mvt:if>
</option>
</mvt:if>
</mvt:foreach>
</select>
<div id="js-swatches" class="cmp-product-list__swatches" data-hook="product-details__swatches"></div>
</div>
<mvt:elseif expr="l.settings:attribute:type EQ 'checkbox'">
<div class="form-row">
<mvt:if expr="l.settings:attribute:required">
<label for="&mvt:attributeID;" title="&mvte:attribute:prompt;" class="required">
<mvt:if expr="g.Product_Attributes[l.settings:attribute:index]:value">
<input type="checkbox" name="Product_Attributes[&mvte:attribute:index;]:value" value="Yes" id="&mvt:attributeID;" checked="checked" data-attribute="&mvte:attribute:code;" data-option-price="&mvt:attribute:price;" data-regular-price="" />
<mvt:else>
<input type="checkbox" name="Product_Attributes[&mvte:attribute:index;]:value" id="&mvt:attributeID;" data-attribute="&mvte:attribute:code;" data-option-price="&mvt:attribute:price;" data-regular-price="" />
</mvt:if>
<mvt:if expr="l.settings:attribute:image">
<img src="&mvte:attribute:image;" alt="&mvte:attribute:prompt;" title="&mvte:attribute:prompt;" />
<mvt:else>
&mvte:attribute:prompt;
<mvt:if expr="l.settings:attribute:price">
<mvt:if expr="l.settings:attribute:price GT 0">
&nbsp;<mvt:eval expr="' +$' $ rnd(l.settings:attribute:price, 2)" />
<mvt:else>
&nbsp;<mvt:eval expr="' -$' $ rnd(l.settings:attribute:price, 2)" />
</mvt:if>
</mvt:if>
</mvt:if>
</label>
<mvt:else>
<label for="&mvt:attributeID;" title="&mvte:attribute:prompt;">
<mvt:if expr="g.Product_Attributes[l.settings:attribute:index]:value">
<input type="checkbox" name="Product_Attributes[&mvte:attribute:index;]:value" value="Yes" id="&mvt:attributeID;" checked="checked" data-attribute="&mvte:attribute:code;" data-option-price="&mvt:attribute:price;" data-regular-price="" />
<mvt:else>
<input type="checkbox" name="Product_Attributes[&mvte:attribute:index;]:value" id="&mvt:attributeID;" data-attribute="&mvte:attribute:code;" data-option-price="&mvt:attribute:price;" data-regular-price="" />
</mvt:if>
<mvt:if expr="l.settings:attribute:image">
<img src="&mvte:attribute:image;" alt="&mvte:attribute:prompt;" title="&mvte:attribute:prompt;" />
<mvt:else>
&mvte:attribute:prompt;
<mvt:if expr="l.settings:attribute:price">
<mvt:if expr="l.settings:attribute:price GT 0">
&nbsp;<mvt:eval expr="' +$' $ rnd(l.settings:attribute:price, 2)" />
<mvt:else>
&nbsp;<mvt:eval expr="' -$' $ rnd(l.settings:attribute:price, 2)" />
</mvt:if>
</mvt:if>
</mvt:if>
</label>
</mvt:if>
</div>
</mvt:if>
</mvt:foreach>
<mvt:if expr="l.settings:subscription:enabled AND l.settings:subscription:term_count">
<div class="form-row">
<mvt:if expr="l.settings:subscription:mandatory">
<label for="l-subscription" title="Subscribe" class="required">Select Subscription</label>
<select id="l-subscription" class="border--gray" name="Product_Subscription_Term_ID">
<mvt:foreach iterator="term" array="subscription:terms">
<option value="&mvte:term:id;">&mvte:term:descrip;</option>
</mvt:foreach>
</select>
<mvt:else>
<div class="cmp-flex-tabs">
<input id="l-tab-one-time" data-flex-tab type="radio" name="flex-tab" checked>
<label class="cmp-flex-tabs__tab font--uppercase" for="l-tab-one-time">One Time Purchase</label>
<input id="l-tab-subscribe" data-flex-tab type="radio" name="flex-tab">
<label class="cmp-flex-tabs__tab font--uppercase" for="l-tab-subscribe">Subscribe</label>
<div class="cmp-flex-tabs__content">
<select id="l-subscription" class="border--gray" name="Product_Subscription_Term_ID">
<mvt:if expr="NOT l.settings:subscription:mandatory">
<option value="0">Select Subscription</option>
</mvt:if>
<mvt:foreach iterator="term" array="subscription:terms">
<option value="&mvte:term:id;">&mvte:term:descrip;</option>
</mvt:foreach>
</select>
</div>
</div>
</mvt:if>
</div>
</mvt:if>
<input data-hook="product-attribute__count" type="hidden" name="Product_Attribute_Count" value="<mvt:eval expr="miva_array_elements(l.settings:attributes)" />" />

Leave a comment:

lesliekirk replied

11-23-21, 08:24 AM
Originally posted by Matt Zimmermann View Post

Hi Leslie,

Do you have attribute machine set to look for a "Select One"?

Yes, but I discovered that there is also a hard coded <option>Select One</option>
Leave a comment:
Matt Zimmermann replied

11-23-21, 07:28 AM
Hi Leslie,

Do you have attribute machine set to look for a "Select One"?
Leave a comment:
lesliekirk replied

11-22-21, 09:45 AM
Originally posted by Matt Zimmermann View Post

Hi Leslie,

Yes, there was a change made in Miva 10.01.00 that could cause this. You will have to modify Attribute Machine to remove the inventory check:

Thank you! That fixed 2 problems. How do I get the "select one" to display in the drop down lists?
Leave a comment:

Matt Zimmermann replied

11-22-21, 07:50 AM

Hi Leslie,

Yes, there was a change made in Miva 10.01.00 that could cause this. You will have to modify Attribute Machine to remove the inventory check:

Code:

AttributeMachine.prototype.Generate_Discount = function (discount) {
var discount_div;

discount_div = document.createElement('div');
discount_div.innerHTML = discount.descrip + ': ' + discount.formatted_discount;

return discount_div;
};

AttributeMachine.prototype.Generate_Swatch = function (product_code, attribute, option) {
var swatch = document.createElement('li'),
img = document.createElement('img');

img.src = option.image;
img.setAttribute('alt', option.prompt);
img.setAttribute('title', option.prompt);
swatch.setAttribute('data-code', option.code);
swatch.setAttribute('data-color', option.prompt);
swatch.appendChild(img);
return swatch;
};

AttributeMachine.prototype.Swatch_Click = function(input, attribute, option) {
var i,
swatchNameElement = document.querySelector('[data-hook="swatch-name"]');

for (i = 0; i < input.select.options.length; i++) {
if (input.select.options[i].value === option.code) {
input.select.selectedIndex = i;
}
}

this.Attribute_Changed(input);
swatchNameElement.innerHTML = option.prompt;
};

Leave a comment:

lesliekirk started a topic Something changed when the upgrade to 10.01.02

11-21-21, 10:54 AM
Something changed when the upgrade to 10.01.02

Something broke the swatch function after the site updated to version 10.01.02. The "is--active" class stays stuck on the first color and the add to cart button stays grayed out until an attribute is clicked - even if there is only one attribute.

"is--active" class example

only one attribute example

Is there still a way to have a "Select One" as part of each attribute so the customer will know to do something?
Tags: None

Previous template Next

Working...

X