o objetivo é obter os subtotais em cada linha e o totalPedido. Está acontecendo isso parcialmente. Duas coisas mim incomodando: 1 - mesmo mostrando o resultado nos subtotais, no log fica exibindo a mensagem :create:236 Uncaught TypeError: Cannot read property 'value' of undefined at subtotalizar (create:236)"
2 - O totalPedido somente é calculado quando é o último item da iteração. E não soma, apenas concatena. Se eu coloco ParseInt( .. não calcula e nem soma.
gostaria da ajuda para resolver esses problemas, ou seja: 1 - Calcular os subtotais sem exibir essa mensagem de erro no log 2 - calcular o totalPedido sendo a soma de todos eles.
Segue o blade:
<table class="table">
<tr>
<th scope="col">#</th>
<th scope="col">Produto</th>
<th scope="col">Preço</th>
<th scope="col">Quantidade</th>
</tr>
@foreach ($produtosFazenda as $produtos)
<div class="fazenda">
<tr>
<td>
<input type="hidden" class="produtoid" name = "produtoid[]"
placeholder="{{$produtos->id}}" value="{{$produtos->id}}" aria-label="produto" aria-describedby="basic-addon1" >
</td>
<td>
<p>{{$produtos->descricao}}</p></td>
<td>
<input type="Number" class="valor" name="preco[]" readonly
placeholder="{{$produtos->preco}}" value="{{$produtos->preco}}" aria-label="preco" aria-describedby="basic-addon1" >
</td>
<td>
<input type="Number" class="quantidade" name="quantidade[]"
placeholder="0" aria-label="quantidade" aria-describedby="basic-addon1" onblur = "subtotalizar()" />
</td>
<td>
<input type="Number" class="subtotal" id="subtotal" name = "subtotal[]" readonly
placeholder="0" aria-label="subtotal" aria-describedby="basic-addon1" />
</td>
@endforeach
</tr>
</table>
<input type="Number" class="totalPedido" id="totalPedido" name = "totalPedido" value="00" readonly
placeholder="0" aria-label="totalPedido" aria-describedby="basic-addon1" />
@csrf
<input class ="btn btn-primary" type ="submit" value= "Enviar Pedido">
</form>
</div>
function subtotalizar(){
var itensqtd = document.getElementsByClassName("quantidade");
var itensvlr = document.getElementsByClassName("valor");
var itenssubtotal = document.getElementsByClassName("subtotal");
var totalP = document.getElementById("totalPedido");
for (var i=0; i<=itensvlr.length; i++){
itenssubtotal[i].value = parseInt(itensqtd[i].value) * parseInt(itensvlr[i].value);
totalP.value += parseInt(itenssubtotal[i].value);
}
}
</script>
Agradeço desde já.