Mi mesa está aquí:
<div id="MyItems"> <table> <thead> <tr>Quantity</tr> <tr>Items</tr> <tr>Cost</tr> <tr>Totals</tr> </thead> <tbody id="AllItems"> <tr class="trbody"> <td class="qty amount" id="amount1"><input type="number" value="0" min="0" name="quantity" placeholder="Qty." class="quantity"></td> <td class="items">Test Item 1</td> <td class="price">$<span class="price-given">1349</span></td> <td class="total">$<span class="amount">0.00</span></td> </tr> <tr class="trbody"> <td class="qty amount" id="amount1"><input type="number" value="0" min="0" name="quantity" placeholder="Qty." class="quantity"></td> <td class="items">Test Item 2</td> <td class="price">$<span class="price-given">854</span></td> <td class="total">$<span class="amount">0.00</span></td> </tr> </tbody> </table> </div>Este es mi código js que se activa después de hacer clic en el botón. Estoy recuperando los valores de todas las entradas en una matriz, pero me quedé sin saber cómo avanzar.
jQuery('#form_event').click(function (e) { e.preventDefault(); jQuery('.loader').css('display', 'block'); var id = jQuery('#getitemid').val(); var totalAmount = jQuery('#TotalAmount').text(); var ItemArray = []; $('#getprices tbody tr').each(function () { $(".quantity").each(function() { if( $(this).val() !== 0) { ItemArray[$(this).attr("quantity")] = $(this).val(); } }); $(".price").each(function() { ItemArray[$(this).attr("price")] = $(this).val(); }); }); });La imagen de la tabla se muestra a continuación. Ahora lo que quiero es obtener el valor de todas las entradas en una matriz cuando hago clic en el botón Enviar. Solo se debe agregar la cantidad mayor que 0.
Gracias por adelantado.
primero da id a tu mesa.
<div id="MyItems"> <table id="table"> <thead> <tr>Quantity</tr> <tr>Items</tr> <tr>Cost</tr> <tr>Totals</tr> </thead> <tbody id="AllItems"> <tr class="trbody"> <td class="qty amount" id="amount1"><input type="number" value="0" min="0" name="quantity" placeholder="Qty." class="quantity"></td> <td class="items">Test Item 1</td> <td class="price">$<span class="price-given">1349</span></td> <td class="total">$<span class="amount">0.00</span></td> </tr> <tr class="trbody"> <td class="qty amount" id="amount1"><input type="number" value="0" min="0" name="quantity" placeholder="Qty." class="quantity"></td> <td class="items">Test Item 2</td> <td class="price">$<span class="price-given">854</span></td> <td class="total">$<span class="amount">0.00</span></td> </tr> </tbody> </table> </div>aquí está la función del botón
$("#Button").click(function (){ var myTable= document.getElementById('table'); var dataArr = [] $("#myTable tbody tr").each(function (a, b) { let qty= $(this).find('td').eq(0).find('input').val() let item = $(this).find("td:nth-child(2)").text(); let cost = $(this).find("td:nth-child(3)").text(); let total = $(this).find("td:nth-child(4)").text(); if (qty !=0){ dataArr.push({qty: qty, item:item, cost:cost, total:total}) } console.log(dataArr) } })Tenga cuidado con cada cantidad individual.
function totalAmount() { const quantities = document.getElementsByName('quantity'); let totalAmount = 0; for (let i = 0; i < quantities.length; i++) { if (quantities[i].value > 0) { for (let j = 0; j < parseInt(quantities[i].value); j++) { totalAmount += parseInt(quantities[i].parentElement.nextElementSibling.nextElementSibling.children[0].innerHTML); } } } console.log(totalAmount); }Usa el mapa jQuery
$("#yourSubmitButton").click(function (){ let quantity = $('.quantity').map((_,el) => el.value > 0 ? el.value : null).get(); console.log(quantity) }) <div id="MyItems"> <table> <thead> <tr>Quantity</tr> <tr>Items</tr> <tr>Cost</tr> <tr>Totals</tr> </thead> <tbody id="AllItems"> <tr class="trbody"> <td class="qty amount" id="amount1"><input type="number" value="0" min="0" name="quantity" placeholder="Qty." class="quantity"></td> <td class="items">Test Item 1</td> <td class="price">$<span class="price-given">1349</span></td> <td class="total">$<span class="amount">0.00</span></td> </tr> <tr class="trbody"> <td class="qty amount" id="amount1"><input type="number" value="0" min="0" name="quantity" placeholder="Qty." class="quantity"></td> <td class="items">Test Item 2</td> <td class="price">$<span class="price-given">854</span></td> <td class="total">$<span class="amount">0.00</span></td> </tr> </tbody> <button id="yourSubmitButton">Button</button> </table> </div>