Soma de valores em campos

adilsonb · Março 23, 2006

Olá amigos do fórum.

Estou novamente com problema (pra variar, hehehe).

A dúvida que tenho, é como fazer para que, a medida que a pessoa for adicionando valores a um desses campos ele vá totalizando num campo total. (Obs: o usuário não é obrigado a preencher todos os 6 campos de valores).

Segue abaixo o código da página.

Qualquer ajuda é bem vinda.

Obrigado.

<html><head><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"><script language="JavaScript">function fcnOnlyNum(event) {	var kCode = event.keyCode ? event.keyCode : event.which ? event.which : event.charCode;	var caract = new RegExp(/^[0-9 \b]+$/i);	var caract = caract.test(String.fromCharCode(kCode));	if(!caract){		return false;	}}function FormataValor(campo,tammax,teclapres) {var tecla = teclapres.keyCode ? teclapres.keyCode : teclapres.which ? teclapres.which : teclapres.charCode;vr = document.form[campo].value;vr = vr.replace( "/", "" );vr = vr.replace( "/", "" );vr = vr.replace( ",", "" );vr = vr.replace( ".", "" );vr = vr.replace( ".", "" );vr = vr.replace( ".", "" );vr = vr.replace( ".", "" );tam = vr.length;if (tam < tammax && tecla != 8){ tam = vr.length + 1; }if (tecla == 8 ){ tam = tam - 1; }if ( tecla == 8 || tecla >= 48 && tecla <= 57 || tecla >= 96 && tecla <= 105 ){if ( tam <= 2 ){document.form[campo].value = vr; }if ( (tam > 2) && (tam <= 5) ){document.form[campo].value = vr.substr( 0, tam - 2 ) + ',' + vr.substr( tam - 2, tam ); }if ( (tam >= 6) && (tam <= 8) ){document.form[campo].value = vr.substr( 0, tam - 5 ) + '.' + vr.substr( tam - 5, 3 ) + ',' + vr.substr( tam - 2, tam ); }}}</script></head><body><form action="" method="post" name="form" id="form">  <table width="500"  border="0" align="center" cellpadding="2" cellspacing="2">	<tr bgcolor="#E9E9E9">	  <td width="75%" bgcolor="#E9E9E9" class="fontepboldblue">Produto</td>	  <td width="25%" class="fontepboldblue">Valor</td>	</tr>	<tr>	  <td><input name="orc_desc1" type="text" class="imputazul" id="orc_desc1" size="50" maxlength="50"></td>	  <td><span class="fontepbold">R$</span>		  <input name="orc_val" type="text" class="imputazul" style="text-align: right;" id="orc_va1" onKeyPress="return fcnOnlyNum(event)" onKeyDown="FormataValor('orc_val', 13, event)" size="10" maxlength="9"></td>	</tr>	<tr>	  <td><input name="orc_desc2" type="text" class="imputazul" id="orc_desc2" size="50" maxlength="50"></td>	  <td><span class="fontepbold">R$</span>		  <input name="orc_val2" type="text" class="imputazul" style="text-align: right;" id="orc_val2" onKeyPress="return fcnOnlyNum(event)" onKeyDown="FormataValor('orc_val2', 13, event)" size="10" maxlength="9"></td>	</tr>	<tr>	  <td><input name="orc_desc3" type="text" class="imputazul" id="orc_desc3" size="50" maxlength="50"></td>	  <td><span class="fontepbold">R$</span>		  <input name="orc_val3" type="text" class="imputazul" style="text-align: right;" id="orc_val3" onKeyPress="return fcnOnlyNum(event)" onKeyDown="FormataValor('orc_val3', 13, event)" size="10" maxlength="9"></td>	</tr>	<tr>	  <td><input name="orc_desc4" type="text" class="imputazul" id="orc_desc4" size="50" maxlength="50"></td>	  <td><span class="fontepbold">R$</span>		  <input name="orc_val4" type="text" class="imputazul" style="text-align: right;" id="orc_val4" onKeyPress="return fcnOnlyNum(event)" onKeyDown="FormataValor('orc_val4', 13, event)" size="10" maxlength="9"></td>	</tr>	<tr>	  <td><input name="orc_desc5" type="text" class="imputazul" id="orc_desc5" size="50" maxlength="50"></td>	  <td><span class="fontepbold">R$</span>		  <input name="orc_val5" type="text" class="imputazul" style="text-align: right;" id="orc_val5" onKeyPress="return fcnOnlyNum(event)" onKeyDown="FormataValor('orc_val5', 13, event)" size="10" maxlength="9"></td>	</tr>	<tr>	  <td><input name="orc_desc6" type="text" class="imputazul" id="orc_desc6" size="50" maxlength="50"></td>	  <td><span class="fontepbold">R$</span>		  <input name="orc_val6" type="text" class="imputazul" style="text-align: right;" id="orc_val6" onKeyPress="return fcnOnlyNum(event)" onKeyDown="FormataValor('orc_val6', 13, event)" size="10" maxlength="9"></td>	</tr>	<tr bgcolor="#E9E9E9">	  <td class="fontepboldblue">Mão de Obra</td>	  <td><span class="fontepbold">R$</span>		  <input name="mo_hard" type="text" class="imputazul" style="text-align: right;" onKeyPress="return fcnOnlyNum(event)" onKeyDown="FormataValor('mo_hard', 13, event)" id="mo_hard" size="10" maxlength="9"></td>	</tr>	<tr bgcolor="#FFFFCC">	  <td class="fontepboldblue"><div align="right">Total:</div></td>	  <td><span class="fontepbold">R$</span>		  <input name="total" type="text" class="imputazul" style="text-align: right;" id="total" size="10" maxlength="9"></td>	</tr>  </table></form></body></html>

adilsonb · Março 24, 2006

Adriano, obrigado mais uma vez! http://forum.imasters.com.br/public/style_emoticons/default/clap.gif

Funcionou perfeitamente.

Só fiquei com dúvidas com relação a implementação dos outros campos de valores.

var trocaV = /,/g;var trocaP = /\./g;function Soma() {A = document.getElementById("orc_val1").value.replace(trocaV,".");B = document.getElementById("orc_val2").value.replace(trocaV,".");C = document.getElementById("orc_val3").value.replace(trocaV,".");D = document.getElementById("orc_val4").value.replace(trocaV,".");E = document.getElementById("orc_val5").value.replace(trocaV,".");F = document.getElementById("orc_val6").value.replace(trocaV,".");G = document.getElementById("mo_hard").value.replace(trocaV,".");if ((isNaN(A)) || (isNaN(B))) {alert("Preencha os números corretamente!");} else {Total = (parseFloat(A) + parseFloat(B) + parseFloat(C) + parseFloat(D) + parseFloat(E) + parseFloat(F) + parseFloat(G));

Criei até a letra G, pois é o número máximo de campos que o usuário poderá inserir valores.

Minha dúvida é aqui:

if ((isNaN(A)) || (isNaN(B)))

Como ficaria esta parte.

Agradeço desde já pela sua ajuda.

Obrigado amigo.

adilsonb · Março 24, 2006

Olá Adriano,Eu já tinha feito isso para testar aqui, só que dai ele somente soma quando termina de preencher todos os 6 campos... :(

adilsonb · Março 24, 2006

Olá Adriano, obrigado pela ajuda e paciencia :)Não funcionou, está dando algum erro de javascript.Deve ser alguma coisa que estou deixando passar sem querer.Obrigado novamente, amigo.

adilsonb · Março 24, 2006

Oi Adriano, agora não dá mais erro, mas continua somando somente após preencher todos os campos... atualizei no site para você ver.Não imaginei que seria tão complicado assim, hehehe, ainda bem que existem experts em javascript como você para dar uma força nessa hora.Abraços..

adilsonb · Março 27, 2006

Olá Adriano

Agora está somando corretamente os valores, obrigado. http://forum.imasters.com.br/public/style_emoticons/default/joia.gif

Será que em vbscript não teria sido mais fácil, heheheh?

Só me resta uma dúvida, no Firefox, somente nele http://forum.imasters.com.br/public/style_emoticons/default/cry.gif , se o usuário tentar selecionar um valor (marcar ele com o mouse), não consegue deletar usando o "del" nem digitar outro valor por cima, por que será? tem algo a ver com o validador?

O único modo de editar um valor digitado é utilizando o backspace..

Obrigado pela ajuda, novamente.

Adilson

adilsonb · Março 27, 2006

Olá Adriano

Só que no IE eu consigo selecionar e deletar (usando "del") ou apertando um novo valor.

Só no FF é que não rola...

function fcnOnlyNum(event) {	var kCode = event.keyCode ? event.keyCode : event.which ? event.which : event.charCode;	var caract = new RegExp(/^[0-9 \b]+$/i);	var caract = caract.test(String.fromCharCode(kCode));	if(!caract){		return false;	}}

Fleury · Março 28, 2006

http://forum.imasters.com.br/index.php?s=&...ndpost&p=536849

Uso:

<input ....... onkeypress="return fcnOnlyNum(event)" />

adilsonb · Março 28, 2006

Olá Fleury

Já estou utilizando o onkeypress="return fcnOnlyNum(event)" para chamar a função.

Só que no FF ele está bloqueando mais do que devia, hehehe..

Estou usando essa versão do fcnOnlyNum:

function fcnOnlyNum(event) {	var kCode = event.keyCode ? event.keyCode : event.which ? event.which : event.charCode;	var caract = new RegExp(/^[0-9 \b]+$/i);	var caract = caract.test(String.fromCharCode(kCode));	if(!caract){		return false;	}}

Fiz um teste com a função abaixo (do link que você indicou), só que dai ele aceita letras, barra "/", etc..,

function fcnOnlyNum(event) {	var k = getKey(event);	if ((k != 8) && (k != 9) && (k != 13) && (k != 37) && (k != 39) && (k != 46)) {		var caract = new RegExp(/^[0-9]+$/i);		var caract = caract.test(String.fromCharCode(k));			if(!caract) return false;	}	return true;}

A pagina com o script completo: http://www.mczero.com.br/valores.html

Tava fazendo um teste aqui, se adicionar valores acima de 1000 (1350 por exemplo) ele dá erro :(

Agradeço desde já pela ajuda.

Fleury · Março 28, 2006

você copiou a função getKey também???Sem ela não funciona mesmo.Eu testei aqui no IE7 e FF... funcionou nos dois.

adilsonb · Março 28, 2006

Olá Fleury

Não tinha colocado, hehehe. Obrigado por lembrar.

Só precisava de uma ajuda para tentar consertar dois bugs:

- Ao digitar um valor acima de 1000 o script dá um erro e para de somar.

- No FF ainda dá um bug, ao selecionar o valor a ser corrijido e pressionar um número ele não apaga o valor selecionado, adicionando o novo numero juntamente com o valor atual.

Página com o código: http://www.mczero.com.br/valores.html

Essa é uma missão para experts em java como você e o Adriano..

Obrigado amigos..

Fleury · Março 28, 2006

com numeros de 1000 pra cima ele coloca ponto pra separar as casa decimais.quando você dá um isNaN, ele reconheçe o ponto como texto e não como separador de algarismos. Você terá que fazer a verificação do isNaN com o valor sem ponto.quanto ao bug de seleção, vai ser muitoooo complicado fazer isso, capturar seleção, reescrever o número com a tecla pressionada e talz. E o pior, sem certeza de que dará certo.se você achar necessário mesmo, limpe o campo em onfocus=""Abraços

adilsonb · Março 29, 2006

Olá Fleury ou Adriano

Teria como me dar uma dica de como fazer isso?

Na função já tem uma rotina para trocar o "," por "." não poderia dar confusão?

var trocaV = /,/g;var trocaP = /\./g;function Soma() {A = document.getElementById("orc_va").value.replace(trocaV,".");B = document.getElementById("orc_val2").value.replace(trocaV,".");

Consegui fazer funcionar retirando o "." do valor, por exemplo R$ 1.500,00 virou R$ 1500,00

Para fazer isso editei as seguintes linhas:

if ( (tam >= 6) && (tam <= 8) ){document.form[campo].value = vr.substr( 0, tam - 5 ) + '' + vr.substr( tam - 5, 3 ) + ',' + vr.substr( tam - 2, tam ); }

Mas o ideal seria manter a formatação dos valores em reais (R$ 1.500,00) mas infelizmente não consegui fazer.

tnakao · Março 30, 2006

olá, neste código, tem como ao colocar os números, trazer o resultado em código ascii?obrigado

laurimar · Maio 9, 2006

Bom pessoal, o que escreveram aqui me ajudou muito, mas gostaria de compartilhar da experiência que tive, então vou colocar a solução par ao meu problema.

primeiro: eu precisava pegar o valor da string e deixar com 2 casas decimais, então usei a variavel toFixed(2).

ex:

var1 = "100.0"; //valor vindo do banco de dados Mysql, tipo Float	 var2 = "10.0"; //valor vindo do banco de dados Mysql, tipo Float	 soma += var1 * var2;	 var TotalGeral = soma.toFixed(2); //aqui estou dizendo para fixar as casas decimais após o (.) ponto em 2	 Total = TotalGeral.toString().replace(".",","); //aqui estou trocando o (.) pela (,).

Espero estar ajudando com essa solução.

Laurimar Pereira

www.laurimar.guialokal.com.br

Arquivado

Soma de valores em campos

Recommended Posts

adilsonb 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

adilsonb 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

adilsonb 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

adilsonb 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

adilsonb 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

adilsonb 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

adilsonb 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Fleury 3

Compartilhar este post

Link para o post

Compartilhar em outros sites

adilsonb 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Fleury 3

Compartilhar este post

Link para o post

Compartilhar em outros sites

adilsonb 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Fleury 3

Compartilhar este post

Link para o post

Compartilhar em outros sites

adilsonb 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

tnakao 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

laurimar 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Fixar div até atingir uma certa altura

Ajuda com Extends e envio para o banco

PHP+Codeginiter - Orientação para Impressão

Fóruns

Tempo Real

Informação importante