Change table with jquery javascript

Asked

Viewed 649 times

1

I have a dynamically created order table, the user selects the item, the quantity, and whether it is for loan or not, and adds the item in the table.

I needed that when adding again an item that is already inserted in the table (for example the mouse, whose ID is 8) and that the loan column also have the same value, instead of adding a new row to the mouse, increase the amount of the existing row in the table, and I don’t know how to do.

So I need, when adding a new product, to check all the rows in the table in the ID column if there is already the ID of this product being inserted and if the LOAN column of this row also has the same value as the one being inserted, if the 2 conditions are true, instead of adding a new line, just increase the amount of the existing line.

<table id="tabela_pedido">
<thead>
  <tr>
   <th>Item</th>
   <th>Quantidade</th>
   <th>Empréstimo</th>
   <th>Ações</th>
  </tr>
</thead>
<tbody>
 <td style="display:none;">8</td>
 <td>Mouse</td>
 <td>2</td>
 <td>Sim</td>
 <td><button class="btn btn-large btn-danger" onclick="RemoveTableRow(this)" type="button">Remover</button></td>
</tbody>
</table>

Where: the first column that is hidden is the item ID, the second the name, the third the amount being ordered, the third whether it is a loan item or not, and the fourth an action to remove the line

  • What kind of data are you working on? I mean, product data

  • is a product that has ID, name, quantity in stock. and in the order is inserted the product ID and the requested quantity

  • OK, but how do you control the selected products? With array? Or just add in table?

  • I just added it to the table

  • You could try using Datatables for this, and you can still increment your table with search, sort, etc. https://datatables.net/manual/data/

1 answer

0

In your case it would be better to control the selected products with an array of objects, for example:

var produtos = [
    { id: 0, nome: "lorem", valor: 0 },
    { id: 1, nome: "lorem 1", valor: 0 },
    { id: 2, nome: "lorem 2", valor: 0 } 
];

And the selected products:

var selecionados = [
    { id: 1, quantidade: 2, emprestimo: true },
    { id: 2, quantidade: 1, emprestimo: false },
];

When adding a new product to the list, I would check by id if it is already in the list, in this case only add the value of the 'quantity' property of the element. Ex.

var id = 1; // id do produto selecionado    
var encontrado = selecionados.find(function(el) {
                     return el.id === id;
                 }); // busca o produto
if (encontrado)
    encontrado.quantidade++;

Then just display in the table the values going through the array.

  • hi, I ended up doing several things since the time I asked the question, now I’m getting an array with all the rows of the table, I’m trying to do something to go through this array and add up the quantities of the repeated products by deleting them after that. $item[0]['id'] $item[0]['quantity'] I’m getting an array like this ...

Browser other questions tagged

You are not signed in. Login or sign up in order to post.