Variable product selectors: Getting the live selected values

Question

In WooCommerce use the code below to add a custom label after product prices in simple and variables products:

add_filter(\'woocommerce_variation_price_html\         


        

Answer 1

The only way to get this working is to use Javascript / jQuery, but it's complicated as WooCommerce is already running some Javascript / Ajax code on it.

First, Is not possible to detect the selected customer choice on the selectors as WooCommerce remove "selected" attribute from html tags.

Once customer have make a complete selection (so choosed one variation from this variable product), Woocommerce add the corresponding variation ID value in a hidden html field and display the corresponding price.

Our PHP code pass to javascript an array of the variations IDs for this variable product, with the corresponding value of the "quantity" attribute for each of them.

Then we can use the "on blur" javascript event on the html tags to get that hidden variation ID value and then append the price with the right "label".

Here is that functional code, that will add a custom label to the live price depending on the customer selection (so the selected product variation):

add_action( 'woocommerce_after_add_to_cart_form', 'custom_get_variations_js' );
function custom_get_variations_js() {
    global $product;

    // Set HERE your "quantity" attribute slug
    $attribute_qty_slug = 'pa_quantity';
    $attribute_qty_slug_key = 'attribute_'.$attribute_qty_slug;

    foreach($product->get_available_variations() as $values){
        $attribute_qty_slug_value = $values['attributes'][$attribute_qty_slug_key];
        $attribute_qty_name_value = get_term_by( 'slug', $attribute_qty_slug_value, $attribute_qty_slug );
        $variations_id_arr[$values['variation_id']] = __(' per ', 'woocommerce' ) . strtolower($attribute_qty_name_value->name);
    }

    ## THE JQUERY SCRIPT ##
    ?>
    
    

Then we need to change your existing code to avoid displaying a second custom label on this specifics variable products (in the first hooked function):

add_filter('woocommerce_variation_price_html','prices_custom_labels', 10, 2 );
add_filter('woocommerce_price_html','prices_custom_labels', 10, 2 );
function prices_custom_labels( $price, $product ){

    // Custom label name
    $per_dozen = ' '. __('per dozen', 'woocommerce' );

    // Set HERE your "quantity" attribute slug
    $attribute_qty_slug = 'pa_quantity';

    $attribute_qty_slug_key = 'attribute_'.$attribute_qty_slug;
    $append_label = '';

    // 1) Variable products
    if ($product->product_type != 'simple' && $product->variation_id ) {

        // Getting the attribute "quantity" value
        $attribute_qty_is_set = $product->variation_data[$attribute_qty_slug_key];
        echo '
'; print_r($product->variation_data[$attribute_qty_slug_key]); echo '
';

        // if "quantity" not set we display " per dozen"
        if( ! $attribute_qty_is_set )
            $append_label = $per_dozen;


        // Outputed price + custom label
        $price = ''.woocommerce_price( $product->regular_price ).$append_label.'';
    }
    // 2) Simple products
    else
    {
        // Here the output price + custom default label
        $price = ''.woocommerce_price( $product->regular_price ).$per_dozen.'';
    }
    return $price;
}

add_filter('woocommerce_variable_price_html', 'prices_custom_labels_min_max', 20, 2);
function prices_custom_labels_min_max( $price, $product) {

    // Custom label name
    $per_dozen = ' '. __('per dozen', 'woocommerce' );
    $per_case = ' '. __('per case', 'woocommerce' );

    // Set HERE your quantity attribute slug
    $attribute_qty_slug = 'pa_quantity';


    // Getting the min and max variations prices
    $variation_min_reg_price = $product->get_variation_regular_price('min', true);
    $variation_max_reg_price = $product->get_variation_regular_price('max', true);
    $variation_reg_price = $product->get_variation_regular_price();


    if( $variation_min_reg_price == $variation_max_reg_price )
    {
        $price = ''.woocommerce_price($variation_reg_price) . $per_dozen . '';
    }
    else
    {
        if( !in_array( $attribute_qty_slug, array_keys( $product->get_attributes() ) ) )
        {
            $price = '' . woocommerce_price($variation_min_reg_price) . $per_dozen . ' - ' . woocommerce_price($variation_max_reg_price) . $per_dozen . '';
        }
        else
        {
            $price = '' . woocommerce_price($variation_min_reg_price) . $per_dozen . ' - ' . woocommerce_price($variation_max_reg_price) . $per_case . '';
        }
    }
    // print_r($product->get_attributes());
    return $price;
}

Code goes in function.php file of your active child theme (or theme) or also in any plugin file.

---

Related answer:

• Pass the chosen product variations data into Contact Form 7 enquiry form
• Adding custom text labels to the product prices depending on their type

0 讨论(0)

查看其它2个回答

发布评论: