Корзина в Django не обновляется во фронтенде, но прекрасно работает в базе данных

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

Мой HTML код для этого:

<select class="form-select form-select-sm" id="size-cart{{ product.id }}">
{% for key, value in sizes.items %}
{% if key == product.id %}
  <option selected value="{{ value.id }}">{{ value.size }}</option>
{% endif %}
{% endfor %}
{% for size in all_sizes %}
  <option value="{{ size.id }}">{{ size.size }}</option>
{% endfor %}
</select>

Фронтенд связанный код:

<script>
$(document).on('click', '.update-cart', function(e){
  e.preventDefault();
  var product_id = $(this).data('index');
  var product_size = $('#size-cart'+ product_id).val();

  console.log("Size: ", product_size);

  $.ajax({
    type: 'POST',
    url : "{% url 'cart_update' %}",
    data: {
      product_id : $(this).data('index'),
      product_qty: $('#select' + product_id + ' option:selected').text(),
      product_size: product_size,
      csrfmiddlewaretoken: '{{ csrf_token }}',
      action: 'post'
    },
    success: function(json) {
      location.reload();
    },

    error: function(xhr, errmsg, err){

    }
  });
})
</script>

Соответствующий код в файле views.py

def cart_update(request):
    cart = Cart(request)
    if request.POST.get('action') == 'post':
        print("request POST data:", request.POST)
        product_id = int(request.POST.get('product_id'))
        product_qty = int(request.POST.get('product_qty'))
        size_id = int(request.POST.get('product_size'))
        selected_size = get_object_or_404(Product_Size, id=size_id)
        print("Selected size: ", selected_size)

        

        cart.update(product=product_id, quantity = product_qty, size=selected_size)

        response = JsonResponse({'qty': product_qty})
        messages.success(request, ("Your cart has been updated...."))
        
        return response

Соответствующий код в cart.py в Cart class:

   def update(self, product, quantity, size):
        prdct = get_object_or_404(Product, id=product)
        #print(f"Found product: {prdct}")

        product_id = str(prdct.id)
        product_qty = int(quantity)

        print("Size passed in cart.update ", size)

    
        

        if product_id in self.cart:

            self.cart[product_id]['quantity'] = product_qty
            if size:
                self.cart[product_id]['size']= size.size
                print(f"Updated cart: {self.cart[product_id]['size']}")
            else:
                self.cart[product_id]['size']= None

            self.session['cart'] = self.cart
            self.session.modified = True
            print("session updated: ", self.session.get('cart'))

        if self.request.user.is_authenticated:

            current_user = Profile.objects.filter(user__id=self.request.user.id)
            carty = str(self.cart)
            carty = carty.replace("\'", "\"")
            current_user.update(old_cart=str(carty))

        return self.cart

В print() в cart.update() я получаю правильную информацию, например, какой выпадающий список я выбрал. А также в Ajax правильно передается выбранный размер. I selected xxl size

Я выбрал размер xxl After clicking update button it remains M-32 again

После нажатия кнопки обновления снова остается M-32. Это прекрасно работает для количества. Как это решить?

Попробуйте следующее:

<select class="form-select form-select-sm" id="size-cart{{ product.id }}">
{% for key, value in sizes.items %}
{% if key == product.id %}
  <option selected value="{{ value.id }}">{{ value.size }}</option>
{% else %}
  <option value="{{ value.id }}">{{ value.size }}</option>
{% endif %}
{% endfor %}
{% for size in all_sizes %}
  <option value="{{ size.id }}">{{ size.size }}</option>
{% endfor %}
</select>

Не уверен, но похоже, что вы просите HTML выделить только правильные product.id, но это условие обходится, если они не совпадают. Но что тогда?

Этот код работает правильно.

<select class="form-select form-select-sm" id="size-cart{{ product.id }}">
{% for key, value in sizes.items %}
{% if key == product.id|slugify %}
  <option selected>{{ value }}</option>
{% endif %}
{% endfor %}

{% for size in all_sizes %}
<option value="{{size.id}}">{{ size.size }}</option>
{% endfor %}
</select>
Вернуться на верх