prestashop show out of stock in attribute dropdown

Question

I'm currently facing a problem which I can't fix maybe you can help me out.

I'm showing a dropdown with all the sizes. Now I want to show in the dropdown when a product is out of stock (out of stock) next to the size.

I have found a snipet which shows which products are out of stock:

    {foreach from=$combinations key=idCombination item=combination}
        {if $combination.quantity == 0}
            {assign var=attributes value=','|explode:$combination.list}
            {foreach from=$groups key=id_attribute_group item=group}
                {foreach from=$group.attributes key=id_attribute item=group_attribute}
                    {foreach from=$attributes item=attribute name=attribute}
                        {if $id_attribute == $attribute|substr:1:-1}
                            {$group_attribute} - {* if !$smarty.foreach.attribute.last}, {/if *}
                        {/if} 
                    {/foreach}
                {/foreach}
            {/foreach}                
        {/if}
    {/foreach}
{/strip}{/if}

It works but I rather want to show it in the dropdown. How can I get this?

update - the code that generates dropdown

<div id="attributes">
{foreach from=$groups key=id_attribute_group item=group}
{if $group.attributes|@count}
<fieldset class="attribute_fieldset">
<label class="attribute_label" for="group_{$id_attribute_group|intval}">{$group.name|escape:'htmlall':'UTF-8'} :</label>
{assign var="groupName" value="group_$id_attribute_group"}
<div class="attribute_list">



------   this is the select ----------------------
{if ($group.group_type == 'select')}
<select name="{$groupName}" id="group_{$id_attribute_group|intval}" class="attribute_selectt" onchange="findCombination();getProductAttribute();{if $colors|@count > 0}$('#wrapResetImages').show('slow');{/if};">
{foreach from=$group.attributes key=id_attribute item=group_attribute}
<option value="{$id_attribute|intval}"{if (isset($smarty.get.$groupName) && $smarty.get.$groupName|intval == $id_attribute) || $group.default == $id_attribute} selected="selected"{/if} title="{$group_attribute|escape:'htmlall':'UTF-8'}">{$group_attribute|escape:'htmlall':'UTF-8'}</option>
{/foreach}
</select>
 ------------ select endd ----------------



{elseif ($group.group_type == 'color')}
<ul id="color_to_pick_list" class="clearfix">
{assign var="default_colorpicker" value=""}
{foreach from=$group.attributes key=id_attribute item=group_attribute}
<li{if $group.default == $id_attribute} class="selected"{/if}>
<a id="color_{$id_attribute|intval}" class="color_pick{if ($group.default == $id_attribute)} selected{/if}" style="background: {$colors.$id_attribute.value} !important;" title="{$colors.$id_attribute.name}" onclick="colorPickerClick(this);getProductAttribute();{if $colors|@count > 0}$('#wrapResetImages').show('slow');{/if}">
{if file_exists($col_img_dir|cat:$id_attribute|cat:'.jpg')}
<img src="{$img_col_dir}{$id_attribute}.jpg" alt="{$colors.$id_attribute.name}" width="20" height="20" /><br>
{/if}
</a>
</li>
{if ($group.default == $id_attribute)}
{$default_colorpicker = $id_attribute}
{/if}
{/foreach}
</ul>
<input type="hidden" class="color_pick_hidden" name="{$groupName}" value="{$default_colorpicker}" />
{elseif ($group.group_type == 'radio')}
{foreach from=$group.attributes key=id_attribute item=group_attribute}
<input type="radio" class="attribute_radio" name="{$groupName}" value="{$id_attribute}" {if ($group.default == $id_attribute)} checked="checked"{/if} onclick="findCombination();getProductAttribute();{if $colors|@count > 0}$('#wrapResetImages').show('slow');{/if}">                                    {$group_attribute|escape:'htmlall':'UTF-8'}<br/>
{/foreach}
{/if}
</div>
</fieldset>
{/if}
{/foreach}
</div>

Answer 1

Prestashop 1.7.6.4

It can be done pretty easily by modifying /themes/[YOUR_THEME]/templates/catalog/_partials/product-variants.tpl file.

{if $group.group_type == 'select'}
        <select
          id="group_{$id_attribute_group}"
          class="form-control form-control-select"
          data-product-attribute="{$id_attribute_group}"
          name="group[{$id_attribute_group}]">
          {foreach from=$group.attributes key=id_attribute item=group_attribute}

            {if {$group.attributes_quantity[{$id_attribute|intval}]} < 1}
              <option value="{$id_attribute}" title="{$group_attribute.name}"{if $group_attribute.selected} selected="selected"{/if}>{$group_attribute.name} - {l s='Sold Out' d='Shop.Theme.Catalog'}</option>
            {else}
            <option value="{$id_attribute}" title="{$group_attribute.name}"{if $group_attribute.selected} selected="selected"{/if}>{$group_attribute.name}</option>
            {/if}

          {/foreach}
        </select>

You can change the text displayed next to the unavailable variant as well as translate it.

Also, if you don't want the variant to be clickable, it can be changed to grey out with HTML:

{if {$group.attributes_quantity[{$id_attribute|intval}]} < 1}
          <option value="{$id_attribute}" title="{$group_attribute.name}"{if $group_attribute.selected} selected="selected"{/if} disabled>{$group_attribute.name} - {l s='Sold Out' d='Shop.Theme.Catalog'}</option>
        {else}
        <option value="{$id_attribute}" title="{$group_attribute.name}"{if $group_attribute.selected} selected="selected"{/if}>{$group_attribute.name}</option>
        {/if}

Answer 2

<select class="form-control attribute_select no-print" name="{$groupName}" id="group_{$id_attribute_group|intval}">
    {foreach from=$group.attributes key=id_attribute item=group_attribute}
        {if ($group.attributes_quantity[{$id_attribute|intval}] <= 0)}
            {$disabledvar = "disabled"}
            {$esgotado = "Esgotado"}
        {else}
            {$disabledvar = ""}
            {$esgotado = ""}
        {/if}    

        <option value="{$id_attribute|intval}"{if (isset($smarty.get.$groupName) && $smarty.get.$groupName|intval == $id_attribute) || $group.default == $id_attribute} selected="selected"{/if} title="{$group_attribute|escape:'html':'UTF-8'}" {$disabledvar}>{$group_attribute|escape:'html':'UTF-8'} {$esgotado}</option>
    {/foreach}
</select>

Answer 3

For PS 1.6.X I think is better to get the stock quantity in smarty, for example:

Find in product.tpl the atribute option name:

{$group_attribute|escape:'html':'UTF-8'}

And replace to:

{$group_attribute|escape:'html':'UTF-8'}
   {if {$group.attributes_quantity[{$id_attribute|intval}]} < 1}
       - {l s='Out Stock'}
   {/if}

And you can show Attribute name - Out of stock without modify prestashop core when a product attribute is out of stock.

You can show another mesagge when the attribute product quantity is little than X aswell.

Answer 4

Heres one way by editing/overriding the Controller for Products. Tested on Prestashop 1.5.2

In controller ProductController you will see function assignAttributesGroups This handles the groups/attributes that are available for display on your views.

// wash attributes list (if some attributes are unavailables and if allowed to wash it)
if (!Product::isAvailableWhenOutOfStock($this->product->out_of_stock) && Configuration::get('PS_DISP_UNAVAILABLE_ATTR') == 0)
{
    foreach ($groups as &$group)
        foreach ($group['attributes_quantity'] as $key => &$quantity)
            if (!$quantity)
                unset($group['attributes'][$key]);

    foreach ($colors as $key => $color)
        if (!$color['attributes_quantity'])
            unset($colors[$key]);
}

You can see here, the attribute is removed from the available groups. If you want it to remain in the list override this function and controller recreating this function.

Change

if (!$quantity)
    unset($group['attributes'][$key]);

to

if (!$quantity)
    $group['attributes'][$key] .= " Sold Out";

For more info on PrestaShop and overriding see http://doc.prestashop.com/display/PS15/Overriding+default+behaviors