Mostrando o resultado do calculo de 2 campos

Gilberto Jr · Fevereiro 17, 2014

Bom dia;

Seguinte, eu tenho um formulário e nele tem o campo de quantidade e também o valor unitário e outro campo valor total.

O campo quantidade sempre vai vir como padrão com o valor 1 e o valor unitário com o valor de R$ 0,00.

Só que o que eu quero é que na hora que trocasse o valor unitário de R$ 0,00 [ por exemplo R$ 1,00 ] fazer o calculo e mostrar no campo valor total.

Por exemplo,

A QUANTIDADE É 2 E O VALOR UNITÁRIO É R$ 10,00 ENTÃO O VALOR TOTAL SERIA R$ 20,00.

E se o campo valor unitário ou quantidade for alterado o valor total também.

Att;

Lucas Guima · Fevereiro 17, 2014

Utilize o evento keyup para pegar a alteração dos campos.

Gilberto Jr · Fevereiro 17, 2014

Pode me da um exemplo?

Att;

Lucas Guima · Fevereiro 17, 2014

https://www.google.com.br/search?q=js+keyup

Gilberto Jr · Fevereiro 17, 2014

Bom, eu já tenho esse código.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Teste JavaScript</title>
<script type="text/javascript">
function preencherCampo(valor){
        document.getElementById("valorunitario").value = valor;
        return true;
}
</script>
</head>

<body>
Quantidade: <input type="text" id="quantidade" name="quantidade" onkeyup="preencherCampo(this.value);" value="2" /><br />
Valor Unitario : <input type="text" id="valorunitario" name="valorunitario" value="0.10" /><br />
Valor Total : <input type="text" id="valortotal" name="total" value="" />
</body>
</html>

Eu quero que ali no campo valor total apareça R$ 0.20 e se o valor da quantidade ou valor unitário for alterado mudar o valor total também.

Att;

marcelobbt · Fevereiro 18, 2014

O comando onkeyup tem que estar tanto no campo qtd quanto no valor unitárioNa função, deve pegar o valor dos três campos e executar a multiplicação, retornando o valor para o campo total.

Segue o código abaixo:

function adicionatotal(valor) {
var $qtd= document.getElementById('qtd');
var $custo= document.getElementById('custo');
var $TotalCusto = document.getElementById('TotalCusto');
$TotalCusto.value = parseInt($custo.value)*parseInt($qtd.value);
}

Gilberto Jr · Fevereiro 18, 2014

Obrigado MARCELOBBT, o que você passou deu certo.

Fico assim o codigo

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Teste JavaScript</title>
 
<script type="text/javascript">
function adicionatotal(valor) {
var $qtd= document.getElementById('quantidade');
var $custo= document.getElementById('valorunitario');
var $TotalCusto = document.getElementById('valortotal');
$TotalCusto.value = parseInt($custo.value)*parseInt($qtd.value); 
}
</script>
</head>
 
<body>
Quantidade: <input type="text" id="quantidade" name="quantidade" onkeyup="adicionatotal(this.value);" value="" /><br />
 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>
<script src="js/jquery.maskMoney.js" type="text/javascript"></script>
Valor Unitario : <input type="text" id="valorunitario" onkeyup="adicionatotal(this.value);" name="valorunitario" value="" /><br />
<script type="text/javascript">$("#valorunitario").maskMoney({symbol:'', thousands:'.', decimal:',', symbolStay: true});</script>
Valor Total : <input type="text" id="valortotal" name="total" value="" />
 
</body>
</html>

Só que os numeros decimais ele não calcula.

Por exemplo, eu colocando 1 na quantidade de o valor de 0,10 o resultado fica 0.

E se eu colocar 2 na quantidade com o valor 2,22 fica 4 quando na verdade deveria ficar 4,44 e o valor totalcusto fica interio.

Att;

Andrew Marques · Fevereiro 18, 2014

Uso algo parecido em um sistema meu...

Porém, faço esse cálculo na hora de preencher as informações, exemplo:

Campos:

Cod Barras | Nome | Quant. | Valor unit. | Subtotal

A pessoa digita (passa o leitor) o codigo de barras e automaticamente meu sistema preenche o nome, a quant (1) o valor unit do produto e o subtotal igual ao valor unit.

Ai uso a função keyup, como citou nosso amigo, no campo quant. com uma função simples apenas para calcular o subtotal...

Gilberto Jr · Fevereiro 18, 2014

Mas o seu calculo subtotal entra como moeda mesmo.

Por exemplo a quantidade for 2 e valor unitário for R$ 2,22 o subtotal vai ficar R$ 4,44 ou se o valor unitário for centavos ficaria assim 2 e o valor R$ 0,20 ficaria R$ 0,40?

Att;

xanburzum · Fevereiro 18, 2014

eu tenho um form que é praticamente mesa coisa, só que é pra somar

<html>
<head>
<script type="text/javascript">
function id( el ){
        return document.getElementById( el );
}
function converte( el ){
        var dinheiro= id( el ).value.replace( ',', '.' );
        return parseFloat( dinheiro )*100;
}
function soma()
{
        var total = converte('soma1')+converte('soma2');
        id('total').value = 'R$ '+total/100;
}
</script>
</head>
<body>
        <form action="" method="">
                <input name="soma1" id="soma1" /><br />
                <input name="soma2" onkeyup="soma()" id="soma2"  /><br />
                         <input name="total" readonly id="total" /><br />
                <input type="button" onkeyup="soma()" value="Total" />
        </form>
</body>
</html>

Gilberto Jr · Fevereiro 19, 2014

Deu certo na soma, eu fiz o teste aqui.

Porem na hora que mudei do sinal de soma "+" para o de multiplicação "*" não deu certo.

<html>
<head>
<script type="text/javascript">
function id( el ){
        return document.getElementById( el );
}
function converte( el ){
        var dinheiro= id( el ).value.replace( ',', '.' );
        return parseFloat( dinheiro )*100;
}
function soma()
{
        var total = converte('soma1')*converte('soma2');
        id('total').value = 'R$ '+total/100;
}
</script>
</head>
<body>
        <form action="" method="">
                <input name="soma1" id="soma1" /><br />
                <input name="soma2" onkeyup="soma()" id="soma2"  /><br />
                 <input name="total" readonly id="total" /><br />
                <input type="button" onkeyup="soma()" value="Total" />
        </form>
</body>
</html>

xanburzum · Fevereiro 19, 2014

qual erro deu ?

Gilberto Jr · Fevereiro 19, 2014

Não deu erro, só fica no formato errado.

Por exemplo, se eu coloco 5 * 2.50 fica 125000 e na verdade seria 12.5.

Att;

Andrew Marques · Fevereiro 20, 2014

Você tem que transformar o valor...

De R$ 50,00 para 50.00, de R$ 1.250,99 para 1250.99.

Aí resolverá! :thumbsup:

Gilberto Jr · Fevereiro 20, 2014

E como eu faço essa transformação?

Fiote · Fevereiro 20, 2014

var x = 'R$ 1.550,00';

x = x.replace('R$',''); // tirando o cifrão // ' 1.550,00'

x = x.replace(' ',''); // tirando os espaços // '1.550,00'

x = x.replace('.',''); // tirando o ponto do milhar // '1550,00'

x = x.replace(',','.'); // trocando a vírgula // '1550.00'

console.log(x);

Andrew Marques · Fevereiro 20, 2014

Em PHP:

$valor = "1.299,90";
$valor = str_replace(".", "", $valor);
$valor = str_replace(',', '.', $valor);
echo $valor;

xanburzum · Fevereiro 20, 2014

você quer no formato moeda ou numérico ?

para definirmos a quantidade de casas decimais temos que usar de artimanhas icon_smile.gif?m=1129645325g .

function roundNumber (rnum) { return Math.round(rnum*Math.pow(10,2))/Math.pow(10,2); }

2 – float2moeda

A partir de um valor float ela retorna o valor formatado com separador de milhar e vírgula nos centavos.

function float2moeda(num) { x = 0; if(num<0) { num = Math.abs(num); x = 1; } if(isNaN(num)) num = "0"; cents = Math.floor((num*100+0.5)%100); num = Math.floor((num*100+0.5)/100).toString(); if(cents < 10) cents = "0" + cents; for (var i = 0; i < Math.floor((num.length-(1+i))/3); i++) num = num.substring(0,num.length-(4*i+3))+'.' +num.substring(num.length-(4*i+3)); ret = num + ',' + cents; if (x == 1) ret = ' - ' + ret;return ret; }

3 – moeda2float

Pega um valor formatado com virgula e separador de milha e o transforma em float

function moeda2float(moeda){ moeda = moeda.replace(".",""); moeda = moeda.replace(",","."); return parseFloat(moeda); }

Referência

http://www.truquesedicas.com/tutoriais/javascript/00018a.htm

http://www.mediacollege.com/internet/javascript/number/round.html

Gilberto Jr · Fevereiro 24, 2014

Quero no formato de moeda...

Att;

xanburzum · Fevereiro 24, 2014

function float2moeda(num) {

x = 0;

if(num<0) {

num = Math.abs(num);

x = 1;

}

if(isNaN(num)) num = "0";

cents = Math.floor((num*100+0.5)%100);

num = Math.floor((num*100+0.5)/100).toString();

if(cents < 10) cents = "0" + cents;

for (var i = 0; i < Math.floor((num.length-(1+i))/3); i++)

num = num.substring(0,num.length-(4*i+3))+'.'

+num.substring(num.length-(4*i+3));

ret = num + ',' + cents;

if (x == 1) ret = ' - ' + ret;return ret;

Arquivado

Mostrando o resultado do calculo de 2 campos

Recommended Posts

Gilberto Jr 26

Compartilhar este post

Link para o post

Compartilhar em outros sites

Lucas Guima 164

Compartilhar este post

Link para o post

Compartilhar em outros sites

Gilberto Jr 26

Compartilhar este post

Link para o post

Compartilhar em outros sites

Lucas Guima 164

Compartilhar este post

Link para o post

Compartilhar em outros sites

Gilberto Jr 26

Compartilhar este post

Link para o post

Compartilhar em outros sites

marcelobbt 7

Compartilhar este post

Link para o post

Compartilhar em outros sites

Gilberto Jr 26

Compartilhar este post

Link para o post

Compartilhar em outros sites

Andrew Marques 47

Compartilhar este post

Link para o post

Compartilhar em outros sites

Gilberto Jr 26

Compartilhar este post

Link para o post

Compartilhar em outros sites

xanburzum 169

Compartilhar este post

Link para o post

Compartilhar em outros sites

Gilberto Jr 26

Compartilhar este post

Link para o post

Compartilhar em outros sites

xanburzum 169

Compartilhar este post

Link para o post

Compartilhar em outros sites

Gilberto Jr 26

Compartilhar este post

Link para o post

Compartilhar em outros sites

Andrew Marques 47

Compartilhar este post

Link para o post

Compartilhar em outros sites

Gilberto Jr 26

Compartilhar este post

Link para o post

Compartilhar em outros sites

Fiote 24

Compartilhar este post

Link para o post

Compartilhar em outros sites

Andrew Marques 47

Compartilhar este post

Link para o post

Compartilhar em outros sites

xanburzum 169

Compartilhar este post

Link para o post

Compartilhar em outros sites

Gilberto Jr 26

Compartilhar este post

Link para o post

Compartilhar em outros sites

xanburzum 169