Hide/grey-out unavailable variations

  • Does anyone know how to hide/grey-out unavailable attributes when the variation does not exist?

    When the plugin is disabled (as Woocommerce default), unavailable attributes don’t show in a dropdown when one attribute is selected in the other dropdown if the variation does not exist. And this is exactly what I want when this plugin is abled.

    But when the plugin is activated, the system let you select even unavailable attributes then gives you an error message instead saying “Sorry, no products matched your selection. Please choose a different combination.”.

    Is there a way to hide/grey-out unavailable attributes when one attribute is selected so that customers know particular variation is not available?
    Something like this;

    The page I need help with: [log in to see the link]

Viewing 6 replies - 1 through 6 (of 6 total)

  • Hi, I’m trying to do the same, but still cann’t do it. I watch in your page you did it, please can you help me with it? Thanks!

    has anyone found a solution ? It’s a great plugin otherwise, but this issue is killing it for me ??

    credit to @lemehovskiy for this magical script

    $( “.variations_form” ).on( “woocommerce_update_variation_values”, function () {

    let $swatches = $(‘.tawcvs-swatches’);

    $swatches.find(‘.swatch’).removeClass(‘hidden’);

    $swatches.each(function(){

    let $select = $(this).prev().find(‘select’);

    $(this).find(‘.swatch’).each(function(){

    if (!($select.find(‘option[value=”‘+ $(this).attr(‘data-value’) +'”]’).length > 0)) {
    $(this).addClass(‘hidden’);
    }

    })
    })

    } );

    Hi
    where i have to add this script ?
    $( “.variations_form” ).on( “woocommerce_update_variation_values”, function () {

    let $swatches = $(‘.tawcvs-swatches’);

    $swatches.find(‘.swatch’).removeClass(‘hidden’);

    $swatches.each(function(){

    let $select = $(this).prev().find(‘select’);

    $(this).find(‘.swatch’).each(function(){

    if (!($select.find(‘option[value=”‘+ $(this).attr(‘data-value’) +’”]’).length > 0)) {
    $(this).addClass(‘hidden’);
    }

    })
    })

    } );

    i am facing the same issue can anyone please tell me where to add the above following script

    In the product description inside script tags

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Hide/grey-out unavailable variations’ is closed to new replies.