İ не могу получить данные с помощью JavaScript

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

main.js

// ADD TO CART
$("#addToCartBtn").on('click',function(){
  var _qty=$("#productQty").val();
  var _productId=$(".product-id").val();
  var _productName=$(".product-name").val();
  console.log(_productId,_productName,_qty);
});

Я использую фреймворк django для написания бэкенда

detail.html

<div class="product-btns">
    <div class="qty-input">
        <span class="text-uppercase">Ədəd: </span>
        <input class="input" type="number" value="1" id="productQty">
    </div>
    <input type="hidden" class="product-id" value="{{product.id}}">
    <input type="hidden" class="product-name" value="{{product.name}}">
    <button class="primary-btn add-to-cart"><i class="fa fa-shopping-cart" id="addToCartBtn"></i> Səbətə at</button>
</div>

Проблема, вероятно, заключается в том, что элемент, имеющий id="addToCartBtn", на самом деле не является кнопкой, а элементом <i>, который не имеет содержимого и, следовательно, ширины. Поэтому он никогда не будет кликабельным.

Вернуться на верх