Options not showing up

[bos]

One product have two options: assembled (+X increased cost) and kit (0 increased cost). This works as expected.

Now, this product comes in two colors; red and blue. The price is the same for both colors, i.e. nothing in the store (stock, cost, etc) is changed. Except for the physical color.

But, I can't get this option combo to work. In option groups, I have "Color" (radio button) with Red/Blue as option attributes. I also have "Assembled" (dropdown list) with Assembled/KIT as option attributes. All options are enabled.

The "Assembled" group shows up in the object description, "Color" does not. I also tried to make an Option Matrix of the four combinations, to no avail.

Question 1: How do I get these two option groups to work? The "Assembled" group is mandatory, i.e. the user has to select (and this works). The "Color" group should be optional, using "Red" as default.

Question 2: If I change a text or anything in the options, the change is not reflected immediately when I refresh my browser. Even a network refresh (shift+F5) does not get the updated text. In fact, sometimes it takes several minutes for changes to appear, if they ever do. Why is this?

[bsmither]

From your picture of the View Product store page, I will conclude you are running Kurouto.

Kurouto does not understand radio button option choosers.

Let me work with the Kurouto skin to add radio buttons.

[bsmither]

In the Kurouto template content.product.php:

Find the OPTIONS array block:

	  {if is_array($OPTIONS)}
	  <div class="options">
		{foreach from=$OPTIONS item=option}
	  	  {if $option.type == '0'}
		<div>
		  <label for="option_{$option.option_id}" class="return">{$option.option_name}{if $option.price} ({$option.symbol}{$option.price}){/if}{if $option.required} *{/if}</label>
		  <span><select name="productOptions[{$option.option_id}]" id="option_{$option.option_id}" class="textbox {if $option.required}required{/if}">
			<option value="">{$LANG.form.please_select}</option>
			{foreach from=$option.values item=value}
			<option value="{$value.assign_id}">{$value.value_name}{if $value.price} ({$value.symbol}{$value.price}){/if}</option>
	  		{/foreach}
			</select>
		  </span>
		</div>
		  {else}
		<div>
		  <label for="option_{$option.option_id}" class="return">{$option.option_name}{if $option.price} ({$option.symbol}{$option.price}){/if}{if $option.required} *{/if}</label>
		  <span>
	  	    {if $option.type == '1'}
		  <input type="text" name="productOptions[{$option.option_id}][{$OPT.assign_id}]" id="option_{$option.option_id}" class="textbox {if $option.required}required{/if}"  />
	  	    {elseif $option.type == '2'}
		  <textarea name="productOptions[{$option.option_id}][{$OPT.assign_id}]" id="option_{$option.option_id}" class="textbox {if $option.required}required{/if}"></textarea>
		    {/if}
		  </span>
		</div>
		  {/if}
		{/foreach}
	  </div>
	  {/if}

Change to:

		{if is_array($OPTIONS)}
		<div class="options">
		{foreach from=$OPTIONS item=option}
{* This section for one to many values per group. *}
			{if $option.type == Catalogue::OPTION_SELECT}{* '0' *}
			<div>
				<label for="option_{$option.option_id}" class="return">{$option.option_name}{if $option.price} ({$option.symbol}{$option.price}){/if}{if $option.required} *{/if}</label>
				<span class="right">
					<select name="productOptions[{$option.option_id}]" id="option_{$option.option_id}" class="textbox {if $option.required}required{/if}">
						<option value="">{$LANG.form.please_select}</option>
				{foreach from=$option.values item=value}
						<option value="{$value.assign_id}">{$value.value_name}{if $value.price} ({$value.symbol}{$value.price}){/if}</option>
				{/foreach}
					</select>
				</span>
			</div>
			{elseif $option.type == Catalogue::OPTION_RADIO}{* '4' *}
			<div>
				<label for="option_{$option.option_id}" class="return">{$option.option_name}{if $option.price} ({$option.symbol}{$option.price}){/if}{if $option.required} *{/if}</label>
				{foreach from=$option.values item=value}
				<span class="left"><input type="radio" name="productOptions[{$option.option_id}]" value="{$value.assign_id}" id="option_{$option.option_id}" /><span style="vertical-align: 15%;">&nbsp;&nbsp;{$value.value_name}{if $value.price} ({$value.symbol}{$value.price}){/if}</span></span>
				{/foreach}
			</div>
			{elseif $option.type == Catalogue::OPTION_CHECKBOX}{* '5' *}
			<div>
				<label for="option_{$option.option_id}" class="return">{$option.option_name}{if $option.price} ({$option.symbol}{$option.price}){/if}{if $option.required} *{/if}</label>
				{foreach from=$option.values item=value}
				<span class="left"><input type="checkbox" name="productOptions[{$option.option_id}]" value="{$value.assign_id}" id="option_{$option.option_id}" />&nbsp;&nbsp;{$value.value_name}{if $value.price} ({$value.symbol}{$value.price}){/if}</span>
				{/foreach}
			</div>

{* This section for entry boxes. *}
			{else}
			<div>
				<label for="option_{$option.option_id}" class="return">{$option.option_name}{if $option.price} ({$option.symbol}{$option.price}){/if}{if $option.required} *{/if}</label>
				<span class="right">
				{if $option.type == Catalogue::OPTION_TEXTBOX}{* '1' *}
					<input type="text" name="productOptions[{$option.option_id}][{$OPT.assign_id}]" id="option_{$option.option_id}" class="textbox {if $option.required}required{/if}"  />
				{elseif $option.type == Catalogue::OPTION_TEXTAREA}{* '2' *}
					<textarea name="productOptions[{$option.option_id}][{$OPT.assign_id}]" id="option_{$option.option_id}" class="textbox {if $option.required}required{/if}"></textarea>
				{/if}
				</span>
			</div>
			{/if}
		{/foreach}
		</div>
	  {/if}

Then, in the Kurouto CSS file common.css:

Find near line 521:

#product_detail > .options div label.return+span {
	display: block;
	margin-top: 3px;
	text-align: right;
}

Change to:

#product_detail > .options div span.right { /* label.return+ */
	display: block;
	margin-top: 3px;
	text-align: right;
}
#product_detail > .options div span.left { /* label.return */
	display: block;
	margin-top: 3px;
	margin-left: 40px;
	text-align: left;
}