Con el foreach voy generando varios <div class="product-quantity">
y en c/u de estos div tengo un input number. esta es la estructura:
<div class="product-quantity">
<input type="number" class="quantity" value="2" min="1">
</div>
Cundo llamo a la funcion Comprar();
desde el boton Comprar, necesito obtener la cantidad elegida en c/u de los input number desde js/jquery y agregarlos a un array. De la forma que lo estoy haciendo me muestra los valores vacíos.
Aca function Comprar() de javascript:
function Comprar() {
var arrPrice = [];
$('.product>.product-price').map(function () {
arrPrice.push(this.innerHTML);
});
//cargando la cantidad de los input number
var arrQuantity = [];
$('.product-quantity>.quantity').map(function () {
alert(this.innerHTML);//el alert muestra lso valores vacios
arrQuantity.push(this.innerHTML);
});
}
Aca muestro la view con el foreach que va generando los divs con los input number.
@model List<Librery_MVC.Models.LightBook>
<div class="shopping-cart" id="ca">
<div class="column-labels">
<label class="product-image">Image</label>
<label class="product-details">Product</label>
<label class="product-price">Precio</label>
<label class="product-quantity">Cantidad</label>
<label class="product-removal">Remove</label>
<label class="product-line-price">Total</label>
</div>
@foreach (LightBook item in Model)
{
<div class="product">
<div class="product-image">
<img src="~/@item.UrlImagen">
</div>
<div class="product-details">
<div class="product-title">@item.Nombre</div>
</div>
<div class="product-price">@item.Precio</div>
<div class="product-quantity">
<input type="number" class="quantity" value="2" min="1" max="">
</div>
<div class="product-removal">
<button class="remove-product" value="@item.IdLibro">
Remove
</button>
</div>
<div class="product-line-price">@item.Precio</div>
</div>
}
<button class="checkout" onclick="Comprar();">Comprar</button>