Блог

Это мой html:

 {% if product.id in list_cart %}
<div class="btn-group" style="display: none;">
<select class="selection-2 border" data-product={{product.id}} style="border: cadetblue;"
 name="size" required id="sizebox">
 {% for t in product.size.all %}
<option value="{{t}}" id="{{t}}">{{t}}</option>
 {% endfor %}
  </select>
  </div>
    {% else %}
 <div class="btn-group">
 <select class="selection-2 border" data-product={{product.id}} style="border: cadetblue;"
    name="size" required id="sizebox">
 {% for t in product.size.all %}
 <option value="{{t}}" id="{{t}}">{{t}}</option>
  {% endfor %}
</select>
  </div>
{% endif %}
  

И это мой javascript:

 var updateBtns = document.getElementsByClassName('update-cart')

for (i=0;i<updateBtns.length;i  ){
updateBtns[i].addEventListener('click',function(){
    var productId=this.dataset.product
    var action=this.dataset.action


    var sizebox = document.getElementById("sizebox");
    var size = sizebox.options[sizebox.selectedIndex].value;
    console.log(size)


    updateUserOrder(productId, action, size)
   
})
}
  

Я работаю над базовым django ecom. Веб-сайт. Я столкнулся с проблемой, которую я не в состоянии решить. Проблема в том, что на странице продуктов моего веб-сайта у каждого продукта есть поле выбора размера товара, и каждое поле выбора имеет одинаковый идентификатор (поскольку я перебираю продукты). Поэтому всякий раз, когда я выбираю размер для любого продукта, отличного от первого продукта, размер, выбранный в первом поле выбора в разделе «Первый продукт», попадает в мою базу данных вместо размера, выбранного в разделе «этот продукт».
Я хочу найти способ, чтобы размер из поля выбора под продуктом отправлялся в базу данных вместо размера из первого поля выбора с id selectbox, что происходит в данный момент. Пожалуйста, помогите. Спасибо.

Попробуйте использовать счетчик циклов и сгенерировать другой идентификатор для поля выбора, используйте loop.index для генерации значения или используйте пользовательский счетчик, например

 counter = 0
{%for ...%}
<option value="{{t}}" id="{{t counter}}">{{t}}</option>
counter  
{%endfor%}
  

Или с помощью loop.index вот ваш код

 {% if product.id in list_cart %}
<div class="btn-group" style="display: none;">
<select class="selection-2 border" data-product={{product.id}} style="border: cadetblue;"
 name="size" required id="sizebox">
 {% for t in product.size.all %}
<option value="{{t}}" id="{{t loop.index}}">{{t}}</option>
 {% endfor %}
  </select>
  </div>
    {% else %}
 <div class="btn-group">
 <select class="selection-2 border" data-product={{product.id}} style="border: cadetblue;"
    name="size" required id="sizebox">
 {% for t in product.size.all %}
 <option value="{{t}}" id="{{t loop.index}}">{{t}}</option>
  {% endfor %}
</select>
  </div>
{% endif %}