Insert field in table and compare if already exists, with JQuery

Navigation
1

Good morning! I'm inserting products into a table with JQuery, similar to a shopping cart, and need to compare if the product has not been inserted before. I tried with the code below, but this is giving problems when comparing with the array, Where am I going wrong? 

var lista = [];
var i = 0;
$('#btn-adicionar').click(function(e) {
  if (lista.length > 0) {
    var id_produto = $('#id_produto').val();
    for (j = 0; j < lista.length; j++) {
      if (jQuery.inArray(id_produto, lista[j].id_produto) == -1) {
        lista[i] = {
          id_produto: $('#id_produto').val(),
          quantidade: $('#quantidade').val(),
          preco: $('#preco').val()
        };
        $('#tabela-adicionar').append("<tr><td>" + lista[i].id_produto + "</td><td>" + lista[i].quantidade + "</td><td>" + lista[i].preco + "</td></tr>");
      } else {
        alert("Produto ja inserido");
      }
    }
    i++;
  } else {
    lista[i] = {
      id_produto: $('#id_produto').val(),
      quantidade: $('#quantidade').val(),
      preco: $('#preco').val()
    };
    $('#tabela-adicionar').append("<tr><td>" + lista[i].id_produto + "</td><td>" + lista[i].quantidade + "</td><td>" + lista[i].preco + "</td></tr>");
    i++;
  }
  $('#id_produto').val("");
  $('#quantidade').val("");
  $('#preco').val("");
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><buttonid="btn-adicionar">ADD</button>
<label>Produto:</label><input type="text" id="id_produto">
<label>Qtd:</label><input type="text" id="quantidade">
<label>Preco:</label><input type="text" id="preco">
<table>
  <thead>
    <tr>
      <td>Produto</td>
      <td>Quantidade</td>
      <td>Preço</td>
      <td>Remover</td>
    </tr>
  </thead>
  <tbody id="tabela-adicionar">
  </tbody>
</table>
    
asked by anonymous 17.04.2018 / 16:01

1 answer

2

Since you're looping for , I do not see much reason to use inArray .

Another problem is the structure you created with this if within for : the way it is, whenever there is no occurrence, an entry will be added to the array, causing duplicate records to be inserted each time the if is equal to -1 .

In this case, it would be best to check for for itself, which even leaves your code simpler. You will not even need this counter i++ . I created a achou flag that changes to true if a product already exists in the array.

See: 

var lista = [];
$('#btn-adicionar').click(function(e) {
  if (lista.length > 0) {
    var id_produto = $('#id_produto').val();
    var achou = false;
    for(var j=0; j<lista.length; j++){
       if(lista[j].id_produto == id_produto){
          achou = true;
          break;
       }
    }
   if (!achou) {
     lista[lista.length] = {
       id_produto: $('#id_produto').val(),
       quantidade: $('#quantidade').val(),
       preco: $('#preco').val()
     };
     $('#tabela-adicionar').append("<tr><td>" + lista[lista.length-1].id_produto + "</td><td>" + lista[lista.length-1].quantidade + "</td><td>" + lista[lista.length-1].preco + "</td></tr>");
   } else {
     alert("Produto ja inserido");
   }
  } else {
    lista[0] = {
      id_produto: $('#id_produto').val(),
      quantidade: $('#quantidade').val(),
      preco: $('#preco').val()
    };
    $('#tabela-adicionar').append("<tr><td>" + lista[0].id_produto + "</td><td>" + lista[0].quantidade + "</td><td>" + lista[0].preco + "</td></tr>");
  }
  $('#id_produto').val("");
  $('#quantidade').val("");
  $('#preco').val("");
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><buttonid="btn-adicionar">ADD</button>
<label>Produto:</label><input type="text" id="id_produto">
<label>Qtd:</label><input type="text" id="quantidade">
<label>Preco:</label><input type="text" id="preco">
<table>
  <thead>
    <tr>
      <td>Produto</td>
      <td>Quantidade</td>
      <td>Preço</td>
      <td>Remover</td>
    </tr>
  </thead>
  <tbody id="tabela-adicionar">
  </tbody>
</table>
    
17.04.2018 / 17:19
Create Threaded Dynamic List Calculation of duration with interval