Как я могу отобразить текстовое сообщение, если количество введенных товаров больше количества товара?

Question

Я хотел бы отобразить пользовательское текстовое сообщение, чтобы уведомить клиентов о том, что они выбрали количество ввода (до нажатия кнопки «Добавить в корзину»).Это сообщение появится, если выбранное количество больше, чем существующее доступное количество, прямо над выбором количества на отдельной странице продукта.Например:

Existing Stock Quantity: 2
User Selects: >2

В таком случае я хотел бы сказать клиенту что-то вроде: «Ваш выбранный объем заказа больше, чем наш существующий запас. Пожалуйста, ожидайте задержку до 2 недель для нашегозапас для пополнения. "

Я пытался добавить пользовательский код в фрагменты кода, который выглядит примерно так:

function display_order_quantity_exceeds_stock_quantity_text( $message, $product ) {

if( $product->woocommerce_quantity_input() > $product->get_stock_quantity()) {
    $message = "Your selected order quantity is greater than our existing stock. Please expect a delay of up to 2 weeks for our stock to be replenished.";
}
return $message;

}

Кто-нибудь знает, какЯ могу получить woocommerce_quantity_input и заставить его работать?

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

Answer 1

Добавление этого кода jQuery в footer.php вашей темы вызовет оповещение, когда пользователь введет значение больше, чем сток

<script type="text/javascript">

function show_error($field, $mesg) {
    if ($field.prev('.error_msg').length) {
        $field.prev('.error_msg').html('<p>' + $mesg + '</p>');
    } else {
        jQuery('<div class="error_msg" style="color:#f00"><p>' + $mesg + '</p></div>').insertBefore($field);
    }

}

function remove_error($field) {
    if ($field.prev('.error_msg').length) {
        $field.prev('.error_msg').remove();
    }
}

jQuery(".quantity input[name=quantity]").on('change', function(e) {

    if (jQuery(this).val() > jQuery(this).attr("max")) {
        show_error(jQuery(this).parent(".quantity"), "Your selected order quantity is greater than our existing stock. Please expect a delay of up to 2 weeks for our stock to be replenished")
    } else {
        remove_error(jQuery(this).parent(".quantity"));
    }
})

</script>

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

Answer 2

Я бы сделал это через jQuery, поэтому добавьте это в ваш functions.php (переменная $ src указывает на местоположение вашего файла JS в папке вашей темы):

function a3_enqueue_scripts() {
    if(is_singular( 'product' )){       
        $handle = 'a3_wooc_js';

        //path to your Javascript file
        $src = get_theme_file_uri( '/js/a3_wooc.js' );

        wp_enqueue_script( $handle, $src, array( 'jquery' ), false, false);  
    }
}

add_action( 'wp_enqueue_scripts', 'a3_enqueue_scripts' );

И что-то подобное ввключенный файл JS:

(function($){
    $(document).ready(function(){
        //the jQuery selector depends on your theme output for the quantity text box identifiers
        $('[name="quantity"]').on('change', function(e){
            var qty_box = $(this);
            var error_message = $('<div class="error_msg">Your selected order quantity is greater than our existing stock. Please expect a delay of up to 2 weeks for our stock to be replenished</div>');

            console.log(parseInt(qty_box.val()), parseInt(qty_box.attr('max')), qty_box.val() > parseInt(qty_box.attr('max')));

            if(parseInt(qty_box.val()) > parseInt(qty_box.attr('max'))) {
                // the action to take if the quantity exceeds max stock     
                if($('.quantity .error_msg').length < 1){
                    $('.quantity').prepend(error_message);                              
                }               
            }
            else {
                $('.quantity .error_msg').remove();
            }
        });
    });
})(jQuery);