Boa Tarde, Preciso de uma grande ajuda, estou travado em um problema que aparentemente deve ser muito fácil! mais não estou conseguindo evoluir.
Tenho um código com os seguintes campos:
No meu script consta com 5 grupos de inputs aparentes e um botão de adicionar mais inputs(inputs dinâmicos), meu problema está na soma dos inputs.
1 - Preciso efetuar a multiplicação dos inputs "Quantidade" X "Valor Und" e seu resultado aparecer no input "Total". No meu atual código esta multiplicação já está sendo feita, o que preciso é que os inputs "Quantidade" e "Valor Und" aceitem a "," Ex.( 5,50 ).Pois estou trabalhando com unidades de medida e dinheiro.(Essa função deverá ser valida para todos os campos até mesmo os dinâmicos)
2 - Necessito efetuar a soma de todos com inputs "Vltotal" ( até mesmo os dinâmicos ) + o input "outras" e seu resultado aparece no campo "totalnfe". Que deverá ser em formatação de Dinheiro R$. Ex( 2,50 ou 2.005,50)
Como falei acredito que seja uma coisa tão simples, só que não estou conseguindo..
Desde já agradeço!
<script>
$(function () {
//Initialize Select2 Elements
$(".select2").select2();
//Date picker
$('#datae').datepicker({
format: 'dd/mm/yyyy',
todayBtn: 'linked',
language: 'pt-BR',
autoclose: true,
todayHighlight: true
});
$('#datav').datepicker({
format: 'dd/mm/yyyy',
todayBtn: 'linked',
language: 'pt-BR',
autoclose: true,
todayHighlight: true
});
});
</script>
<script type="text/javascript">
$(document).ready(function () {
var i = 5;
//adiciona nova linha
$("#add").on("click", function () {
i++;
var newRow = $("<tr>");
var cols = "";
cols += '<td><input type="text" class="form-control" id="cod" name="cod[]"></td>';
cols += '<td><input type="text" class="form-control" id="desc" name="desc[]"></td>';
cols += '<td><input type="text" class="form-control" id="und" name="und[]"></td>';
cols += '<td><input type="text" class="form-control" id="qnd' + i + '" name="qnd[]"></td>';
cols += '<td><input type="text" class="form-control" id="vlund' + i + '" name="vlund[]"></td>';
cols += '<td><input type="text" class="form-control soma" id="vltotal' + i + '" name="vltotal[]" onblur="calcular()"></td>';
cols += '<td><button type="button" name="remove" id="'+i+'" class="btn btn-danger deleteLinha">X</button></td>';
newRow.append(cols);
$("#products-table").append(newRow);
});
//chamada da função para calcular o total de cada linha
$("#products-table").on("blur keyup", 'input[id^="vlund"], input[id^="qnd"]', function (event) {
calculateRow($(this).closest("tr"));
});
//remove linha
$("#products-table").on("click", "button.deleteLinha", function (event) {
$(this).closest("tr").remove();
});
});
//função para calcular o total de cada linha
function calculateRow(row) {
var vlund = +row.find('input[id^="vlund"]').val();
var qnd = +row.find('input[id^="qnd"]').val();
//2 casas decimais
var total = (vlund * qnd).toFixed(2);
//substitui ponto por virgula
total=total.replace(".", ",");
//a regex abaixo coloca um ponto a esquerda de cada grupo de 3 digitos desde que não seja no inicio do numero
row.find('input[id^="vltotal"]').val((total).replace(/\B(?=(\d{3})+(?!\d))/g, "."));
}
$(".soma").blur(function(){
calcular();
});
function calcular() {
var soma = 0;
$(".soma").each(function(indice, item){
var valor = parseFloat($(item).val());
console.log(valor);
if ( !isNaN( valor ) ) {
soma += valor;
}
});
$("#totalnfe").val(soma)
}
</script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<html>
<table class="table" id="products-table">
<thead>
<tr>
<th>Cod.</th>
<th>Descrição</th>
<th>Und.</th>
<th>Quantidade</th>
<th>R$: UND</th>
<th>R$: TOTAL</th>
</tr>
</thead>
<tbody>
<tr>
<td><input type="text" class="form-control cod" id="cod" name="cod[]"></td>
<td><input type="text" class="form-control desc" id="desc" name="desc[]"></td>
<td><input type="text" class="form-control und" id="und" name="und[]"></td>
<td><input type="text" class="form-control" id="qnd" name="qnd[]"></td>
<td><input type="text" class="form-control" id="vlund" name="vlund[]" onblur="calcular()"></td>
<td><input type="text" class="form-control soma" id="vltotal" name="vltotal[]" onblur="calcular()"></td>
</tr>
<tr>
<td><input type="text" class="form-control cod" id="cod" name="cod[]"></td>
<td><input type="text" class="form-control desc" id="desc" name="desc[]"></td>
<td><input type="text" class="form-control und" id="und" name="und[]"></td>
<td><input type="text" class="form-control" id="qnd" name="qnd[]"></td>
<td><input type="text" class="form-control" id="vlund" name="vlund[]"></td>
<td><input type="text" class="form-control soma" id="vltotal" name="vltotal[]" onblur="calcular()"></td>
</tr>
<tr>
<td><input type="text" class="form-control" id="cod" name="cod[]"></td>
<td><input type="text" class="form-control" id="desc" name="desc[]"></td>
<td><input type="text" class="form-control" id="und" name="und[]"></td>
<td><input type="text" class="form-control" id="qnd" name="qnd[]"></td>
<td><input type="text" class="form-control" id="vlund" name="vlund[]"></td>
<td><input type="text" class="form-control soma" id="vltotal" name="vltotal[]" onblur="calcular()"></td>
</tr>
<tr>
<td><input type="text" class="form-control" id="cod" name="cod[]"></td>
<td><input type="text" class="form-control" id="desc" name="desc[]"></td>
<td><input type="text" class="form-control" id="und" name="und[]"></td>
<td><input type="text" class="form-control" id="qnd" name="qnd[]"></td>
<td><input type="text" class="form-control" id="vlund" name="vlund[]"></td>
<td><input type="text" class="form-control soma" id="vltotal" name="vltotal[]" onblur="calcular()"></td>
</tr>
<tr>
<td><input type="text" class="form-control" id="cod" name="cod[]"></td>
<td><input type="text" class="form-control" id="desc" name="desc[]"></td>
<td><input type="text" class="form-control" id="und" name="und[]"></td>
<td><input type="text" class="form-control" id="qnd" name="qnd[]"></td>
<td><input type="text" class="form-control" id="vlund" name="vlund[]"></td>
<td><input type="text" class="form-control soma" id="vltotal" name="vltotal[]" onblur="calcular()"></td>
</tr>
<tr class="row">
</tr>
</tbody>
<tfoot>
<tr>
<td><button type="button" name="add" id="add" class="btn btn-success">Adicionar Linhas +</button></td>
<td></td>
<td></td>
<td></td>
<td><label for="totalnfe">Outras Despesas</label><input type="text" class="form-control" id="outras" name="outras"></td>
<td><label for="totalnfe">Valor Total da Nota</label><input type="text" class="form-control" id="totalnfe" name="totalnfe" readonly></td>
</tr>
</tfoot>
</table>
</html>