Estou com um problema ao adicionar a designação de um artigo através do código. Tenho o seguinte:
HTML
<table class="table table-striped table-bordered" id="vendaTabela" width="100%" >
<thead>
<tr>
<th data-class="expand">Cód.</th>
<th data-hide="phone">Designação</th>
<th data-hide="phone">Qnt.</th>
<th data-hide="phone,tablet">Uni.</th>
<th>Preço</th>
<th>Desconto</th>
<th>IVA</th>
<th>Sub-Total</th>
</tr>
</thead>
<tbody>
<tr id="tr0">
<td class="codigo" contenteditable="true" onblur="codArtigo ( )"></td>
<td class="designacao" contenteditable="true"></td>
<td class="quantidade" contenteditable="true"></td>
<td class="unidade" contenteditable="true"></td>
<td class="preco" contenteditable="true" onblur="subtotal()"></td>
<td class="desconto" contenteditable="true"></td>
<td class="iva" contenteditable="true"></td>
<td class="total" contenteditable="true"></td>
</tr>
</tbody>
</table>
JQUERY
codArtigo = function () {
var $linhas = $("#vendaTabela tbody > tr");
$linhas.each(function () {
var designacao = $(".designacao", this).html();
console.log($(".designacao", this).html());
myJSRoutes.controllers.ArtigoController.getArtigobyId($(".codigo", this).html()).ajax({
success: function (data) {
if (data.length > 0) {
$.each(data, function (key, value) {
$(".designacao", designacao).html(value.designacaoComercial);
console.log(value.designacaoComercial);
$(".unidade", $(".unidade", this).html()).html(value.unidade.descricao);
console.log(value.unidade.descricao);
});
}
}
})
})
}
O que me está a acontecer é o seguinte. Se adiciono o código '1', a tabela preenche a designação com 'exemplo'. Depois se acrescentar outra linha e adicionar outro artigo (código: 2, designação: exemplo2), a designação das duas linhas fica com o nome exemplo2.
Penso que não esteja a conseguir reconhecer o this nesta parte:
var designacao = $(".designacao", this).html();
PS: Ao fazer o console.log($(".codigo", this).html()), se tiver introduzido dois artigos o output é:
Ao inserir o primeiro: 1
Ao inserir o segundo: 1 2
Alguma sugestão ?
EDIT:
Estou com outro problema idêntico e como tal resolvi editar esta pergunta.
//REMOVER LINHAS DA TABELA
$(document).on('click', '#btnDeleteRow', function(){
var $linhas = $("#vendaTabela tbody > tr");
$linhas.each(function () {
var total = $(".total", this);
$(".totalBruto").html(ttb-(parseFloat(total.html())));
console.log(total.html());
})
Estou a tentar atualizar o resultado de uma conta que é o totalBruto-totalLinha. o que me acontece é que se eu tiver duas ou mais linhas, este this : var total = $(".total", this);
parece não me estar a funcionar. O que estarei a falhar ? O console.log(total.html());
imprime todos os totais e não o da linha que se carrega :s
PROBLEMA RESOLVIDO:
Em vez de percorrer as linhas, como estou a utilizar um onclick no botão fui pela linha do botão: var total = $(this).closest('tr').find(".total").text();