Eu tenho um código que gera dinamicamente vários inputs. Além disso tenho uma função que deveria somar o valor informado dentro dos inputs. O problema é que ao invés de somar ele concatena os campos. O estranho é que fiz o mesmo processo em outro lugar e funciona a soma.
Código Javascript:
var tam_grade_produto = document.querySelectorAll("#tam_grade_produto");
var quant_produto = document.querySelectorAll("#quant_produto");
var quant_total_produto = document.querySelector("#quant_total_produto").value;
function preencheTotalProduto(){
var calc_quant_total_produto = 0;
for(var i=0;i<tam_grade_produto.length;i++){
calc_quant_total_produto += quant_produto[i].value;
}
quant_total_produto.textContent = calc_quant_total_produto;
}
document.addEventListener("onchange",function(event){
event.preencheTotalProduto();
});
preencheTotalProduto();
O código abaixo está dentro de um for
e gera campos que preciso:
<tr>
<td><kbd><label id="tam_grade_produto"><?= $tamanho['tamanho']; ?></label></kbd></td>
<td><input size="3" class="form-control" id="quant_produto" type="number" onchange="preencheTotalProduto()" min="1" max="<?= $tamanho['estoque']; ?>"></td>
<td><input size="3" readonly="true" class="form-control" type="number" onchange="preencheTotalProduto()" value="<?= $tamanho['estoque']; ?>"></td>
</tr>
E esse é o trecho do código que deveria armazenar a soma:
<div>Total de pares: <label id="quant_total_produto">0</label></div>
Mas ao preencher o valor de uns 3 inputs com os valores de 1, 2 e 3, por exemplo, no total de pares não aparece 6 e sim 0123. Parece que está concatenando ao invés de somar. Alguém sabe dizer?