Блог

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

Я хочу создать средство настройки продукта. Для товаров (мебели), которые доступны только по запросу. Итак, это интерфейс, который я сделал. https://skmfurniture.com.au/KAALIKA/product/blow-me-away /

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

ПРОБЛЕМА: Вы можете запустить консоль и посмотреть переменную javascript, которую я успешно зарегистрировал. Я изменил переменную javascript на переменную PHP с помощью ajax, а затем попытался вставить ее в корзину. Поскольку все это было сделано в модальном режиме, на странице с одним товаром в woocommerce отображается сообщение «Пожалуйста, выберите вариант продукта», когда я отправляю значения.

Это используемый код ajax:

     // adding to cart
    $('#addToCart a').click(function(e){ 
    
     $.ajax({
            type: "POST",
            data: {                             
                chase: chase,
                item : item,
                price: price,
                size: size,
                mainHex: mainHex,
                accentHex: accentHex,
                mattress: mattress,
                warranty: warranty,
                action: 'your_ajax_function'  
            },
            contentType: 'application/x-www-form-urlencoded; charset=UTF-8',
            dataType: "text",
            success: function (msg) {
                console.log("Chase", chase);
                console.log("Price", price);
                console.log("Item", item);
                console.log("Size", size);
                console.log("Main Color", mainHex);
                console.log("Accent Color", accentHex);
                console.log("Matt", mattress);
                console.log("Warr", warranty);
            },
            error: function (errormessage) {
                  console.log( "ERROR in ajazx" );
            }
      });
    
     window.location.replace("https://skmfurniture.com.au/KAALIKA/cart/");
    });
    
 

Вот как function.php файл выглядит следующим образом:

 // getting values from ajax into php
add_action('wp_ajax_nopriv_your_ajax_function','your_ajax_function'); // Ajax Function should be hooked like this for unauthenticated users
add_action('wp_ajax_your_ajax_function','your_ajax_function'); 

  function your_ajax_function(){

    $price = $_POST['price'];
    $chase = $_POST['chase'];
    $item = $_POST['item'];
    $price = $_POST['price'];
    $size = $_POST['size'];
    $mainHex = $_POST['mainHex'];
    $accentHex = $_POST['accentHex'];
    $mattress = $_POST['mattress'];
    $warranty = $_POST['warranty'];

    echo $chase;
    echo $item;


  }
 
 

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

Если бы вы могли просто посмотреть и направить меня в правильном направлении, я был бы очень признателен.

Проблема

Вы пытаетесь отобразить значения на сервере, которые вы отправляете с помощью ajax, но не видите никаких выходных данных.

Причина

В вашей функции успеха вы console.log(chase) вместо msg . msg это параметр, который вы передаете в функцию успеха, поэтому это данные в области видимости.

// Неправильный путь!

 success: function (msg) {
   console.log("Chase", chase);
},
 

Пример

Это должно показать вам строку, возвращенную с сервера.

// Правильный путь!

 success: function (msg) {
   console.log("Chase", msg);
}
 

Совет профессионала

Если вы не видите значение в DOM, как ожидалось, всегда проверяйте вкладку Сеть в Chrome Dev Tools. Вы можете нажать Сеть -> Ответ, чтобы увидеть ответ от сервера. По крайней мере, тогда вы будете знать, возвращаются ли данные или нет. Это поможет вам отследить проблему.