Tengo una pregunta muy simple. Recién comencé a aprender javascript, así que no puedo resolver el problema. Aquí está mi código.
<div class="card mb-4 shadow-sm"> <div class="card-header"> <h4 class="my-0 font-weight-normal">TEST Product</h4> </div> <div class="card-body"> <h1 class="card-title pricing-card-title">$100</h1> <button type="button" class="btn btn-block btn-outline-primary" onclick="cartLS.add({id: 1, name: 'Product 1', quantity: 100})">Add to Cart</button> </div> </div>Como puede ver, hay una función onclick. En este ejemplo, cuando se hace clic en el botón, la adición del producto al carrito debe ser así.
( id:1 nombre: Producto 1 cantidad:100 ).
Quiero determinar el valor de la cantidad con una entrada. En lugar del botón, me gustaría ingresar una entrada y agregar la cantidad de productos como ese valor de entrada. Cómo puedo hacer eso ?
Muchas gracias.
He resumido la función onClick para facilitar. La razón por la que uso un Objeto llamado producto es para cambios futuros; será más fácil encontrar problemas y administrar el código.
<div class="card mb-4 shadow-sm"> <div class="card-header"> <h4 class="my-0 font-weight-normal">TEST Product</h4> </div> <div class="card-body"> <h1 class="card-title pricing-card-title">$100</h1> <label for="quantity">Qty: </label> <input name="quantity" id="quantity" type="number" placeholder="1" /> <button type="button" class="btn btn-block btn-outline-primary" onClick="handleClick()" > Add to Cart </button> </div> </div> <script> const handleClick = () => { const product = { id: 1, name: "Product 1", quantity: document.getElementById("quantity").value, }; cartLS.add(product); }; </script>