WooCommerce: событие триггера после изменения вариации

Мы используем Woocommerce для продажи colorboxes. В основном выбирается опция переменной продукции.

Мы добавили модальный диалог с цветовой палитрой, где клиент может выбрать цвет. Это находится рядом с общим раскрывающимся списком woocommerce.

Проблема заключается в том, что когда я передаю правый SlugValue в раскрывающийся список (после того, как он выбирается из палитры), значение в раскрывающемся списке верное, но событие, которое нужно уволить, чтобы опубликовать цену, не работает.

Я уже пытался запустить событие onchange в раскрывающемся списке, но ничего не случилось.

Может кто-нибудь сказать мне, какое событие должно быть вызвано, и как?

aprec любая помощь!

Ответ 1

Если кто-то столкнется с этим в будущем: WooCommerce предоставляет триггеры во всем add-to-cart-variant.js, который позволяет вам подключаться к событиям изменений для веб-сайта. Вы можете найти все из них в этом файле, но тот, который, вероятно, поможет большинству в этом случае, может быть использован как таковой

$( ".variations_form" ).on( "woocommerce_variation_select_change", function () {
    // Fires whenever variation selects are changed
} );

$( ".single_variation_wrap" ).on( "show_variation", function ( event, variation ) {
    // Fired when the user selects all the required dropdowns / attributes
    // and a final variation is selected / shown
} );

Если триггер, к которому вы хотите подключиться, является первым аргументом внутри .on(). Вот несколько ниже, чтобы вы начали:

woocommerce_variation_select_change Срабатывает при изменении выбора.

show_variation запускается при обнаружении вариации и фактически передаст вам объект вариации, который найден, чтобы вы могли получить прямой доступ к цене без необходимости фильтровать вручную.

Вы можете просеять и найти остальные здесь.

Ответ 2

Этот код выполняет точную функциональность, запрошенную в исходном вопросе:

$('#WC_variation_drop_down_ID').trigger('change');

Измените "#WC_variation_drop_down_ID" на фактический идентификатор поля, которое вы изменили с помощью jQuery.

Вот более полное решение, которое включает в себя настройку поля, а также запуск выбора вариантов WooCommerce (на основе массива полей переключателей):

var fields = ['.gchoice_4_11_0', '.gchoice_4_11_1', '.gchoice_4_4_0', '.gchoice_4_4_1'];
for ( var i = fields.length; i--; ) {
    $('#gravity_form_wrapper_ID').on('click', fields[i], function() {
        $('#WC_variation_drop_down_ID').val( $(this).children('input').val() ).trigger('change');
    });
}

Решение, вдохновленное этим сообщением о настройке полей вариантов WooCommerce.

Ответ 3

если кто-нибудь придет сюда, как я, чтобы найти ответ, я предоставлю пояснение в этом.

У нас есть проблема с реализацией функции изменения, потому что нам нужно знать цену выбранного варианта, но 'woocommerce_variation_select_change' мы получили цену из предыдущего варианта.

Поэтому, если вы хотите получить цену варианта после завершения изменения, вы должны использовать функцию jQuery "woocommerce_variation_has_changed".

Пример:

jQuery('#select_attribute_of_variation').on('woocommerce_variation_has_changed', function(){ // do your magic here... })