Como exibir soma nos inputs com JS?

[pedrovisk 1]

Olá!

 

Tenho uma página com quatro campos, conforme abaixo:

 

Qtd: quantidade de produtos que nada mais é que um re;cordset

Valor unitário: onde insiro o valor unitário do produtod;

Valor Total do Produto: onde insiro o valor total do produto Qtd*Valor Unitário (que para isso, já tenho um JS fazendo o cálculo)

Total Geral: que é a soma de todo o Valor Total do Produto (neste está o problema, pois eu não sei como utlizar o JS para que ao digitar o valor Unitario, calcule com a Qtd, exiba o valor Total do Produto e exiba a soma no Total Geral).

 

Abaixo está o link direto da página:

 

http://www.fortalmag.com.br/2006/Orcamento...CodOrcamento=50

 

Abaixo está o código da tabela que é gerada através do recorset e o JS:

 

<table width="100%" border="0" cellpadding="1" cellspacing="1">		  <form name="Solicita_Orcamento" method="post">			<tr class="texto_Preto_Titulo">			  <td colspan="6">Detalhes do Orçamento </td>			</tr>			<tr align="center" class="texto_Cinza">			  <td colspan="6"><span class="texto_Laranja_Bold">O N° deste Orçamento é: <font color="#FF0000"><%= Session("CodOrcamento") %></font></span></td>			</tr>			<tr bgcolor="#CCCCCC" class="texto_Pedro_SubTitulo">			  <td width="3%" align="center">Qtd.</td>				<td width="41%" align="center">Produto</td>				<td width="19%" align="center">Tipo de Máquina </td>				<td width="15%" align="center">$ Unitário </td>				<td width="13%" align="center">$ Total</td>				<td width="9%" align="center">Remover</td>			</tr>			<% TotalPodutos = 0While ((Repeat1__numRows <> 0) AND (NOT rsPed.EOF)) TotalPodutos = TotalPodutos + 1%><script language="JavaScript" type="text/javascript">function Somar<%=rsPed("IDProduto")%>() {var Qtd = document.getElementById("Quant_<%=rsPed("IDProduto")%>").value;var ValorUnitario = document.getElementById("ValorUnitario_Z<%=rsPed("IDProduto")%>").value;var ValorProdTotal = Number(Qtd) * Number(ValorUnitario);document.getElementById("ValorProdTotal_Z<%=rsPed("IDProduto")%>").value = formatCurrency(ValorProdTotal); //AQUI FORMATO O CAMPO//document.getElementById("ValorUnitario_Z<%'=rsPed("IDProduto")%>").value = formatCurrency(ValorUnitario); //AQUI FORMATO O CAMPO}</script>			  <tr align="center">				<td bgcolor="#E0E2DE" class="texto_Cinza2"><input name="Quant_<%=(rsPed.Fields.Item("IDProduto").Value)%>" type="text" class="text_01" id="Quant_<%=(rsPed.Fields.Item("IDProduto").Value)%>" value="<%= Trim((rsPed.Fields.Item("Quantidade").Value)) %>" size="2" maxlength="2" onKeypress="return ValidaNumero(event);">				<input name="Produto" type="hidden" id="Produto" value="<%=(rsPed.Fields.Item("IDProduto").Value)%>"></td>				<td bgcolor="#E0E2DE" class="texto_Cinza2"><%=(rsPed.Fields.Item("NomeProduto").Value)%></td>				<td bgcolor="#E0E2DE" class="texto_Cinza2"><%=(rsPed.Fields.Item("NomeTipo").Value)%></td>				<td bgcolor="#E0E2DE" class="texto_Cinza2"><input name="ValorUnitario" type="text" class="text_01" id="ValorUnitario_Z<%=rsPed("IDProduto")%>" onKeyUp="Somar<%=rsPed("IDProduto")%>();" size="10" maxlength="6"></td>				<td bgcolor="#E0E2DE" class="texto_Cinza2"><input name="ValorProdTotal" type="text" class="text_01" id="ValorProdTotal_Z<%=rsPed("IDProduto")%>" size="10" readonly="readOnly"></td>				<td bgcolor="#E0E2DE" class="texto_Cinza2"><a onclick="return confirm('Você deseja remover este produto da sua lista?')" href="Atualiza_Lista_Produtos.asp?Acao=Remover&Produto=<%=(rsPed.Fields.Item("IDProduto").Value)%>&Qtd=<%=(rsPed.Fields.Item("Quantidade").Value)%>""><img src="../images/Remover.gif" alt="Remover Produto" width="9" height="11" border="0"></a></td>			  </tr>			  <%   Repeat1__index=Repeat1__index+1  Repeat1__numRows=Repeat1__numRows-1  rsPed.MoveNext()Wend%>			  <tr bgcolor="#CCFFFF" class="texto_Laranja_Bold">				<td colspan="2">Produtos na Lista: <%= TotalPodutos %></td>				<td align="center" class="texto_Pedro_SubTitulo"><div align="right">Total Geral </div></td>				<td align="center"> </td>				<td align="center"><span class="texto_Cinza2">				  <input name="TotalGeral" type="text" class="text_01" id="TotalGeral" size="10" readonly="readOnly">				</span></td>				<td> </td>			  </tr>			  <tr class="texto_Preto_Titulo">				<td colspan="6" align="center" bgcolor="#CCCCCC">Observações Complementares </td>			  </tr>			  <tr>				<td colspan="6" align="center"><textarea name="textarea" cols="50" rows="6" wrap="virtual"></textarea></td>			  </tr>			  <tr align="center">				<td colspan="6">				<table width="100%" border="0" cellspacing="1" cellpadding="1">				  <tr align="center" class="texto_Cinza_Bold_02">					<td width="33%" bgcolor="#E0E2DE"><a href="java script:atualizar_carrinho()">Atualizar Quantidade</A></td>					<td width="37%" bgcolor="#E0E2DE"><a href="Solicita_Orcamento.asp"></a></td>					<td width="30%" bgcolor="#E0E2DE">Fechar Orçamento </td>				  </tr>				</table>

[Fleury 3]

Script:

function Somar(line) {  var Qtd = document.getElementById("Quant_"+line).value;  var ValorUnitario = document.getElementById("ValorUnitario_Z"+line).value;  var ValorProdTotal = parseFloat(Qtd) * parseFloat(ValorUnitario);  document.getElementById("ValorProdTotal_Z"+line).value = formatCurrency(ValorProdTotal); //AQUI FORMATO O CAMPO}function SomarTotais() {  var totais = document.getElementsByTagName("input");  var total = 0;  for (var i = 0; i < totais.length; i++) {	if (/^ValorProdTotal_Z/.test(totais[i].id))	  if (totais[i].value != "") total += totais[i].value;  }  document.getElementById("TotalGeral").value = total;}

Uso:

<input name="ValorUnitario" type="text" class="text_01" id="ValorUnitario_Z<%=rsPed("IDProduto")%>" onBlur="Somar('<%=rsPed("IDProduto")%>'); SomarTotais()" size="10" maxlength="6">

F.

[pedrovisk 1]

Fleury,Poduto 1-----------------------------Qtd= 10Valor Unitario= 1000Produto 3-----------------------------Qtd=70Valor Unitario= 777E o valor Total Geral tá igual: 010.0005.390O que pode está errado?

[Fleury 3]

tente

document.getElementById("ValorProdTotal_Z"+line).value = ValorProdTotal.toFixed(2);

F.

[pedrovisk 1]

Fleury,

 

Mesmo assim continua. Veja o exemplo que fiz após a alteração:

 

Qtd = 8

Valor Unitário = 1000

Total do Produto = 8000.00

Total Geral = 08000.00

 

Veja o link, após atualização:

http://www.fortalmag.com.br/2006/Orcamento...CodOrcamento=50

 

Muito obrigado,

 

Pedro.

[Fleury 3]

Cadê o código?Entrei lá e não vi nada do que eu tinha feito pra você. Ainda tá criando uma função para cada linha e nem vi a função SomarTotais()

[pedrovisk 1]

Alterei, por favor, veja.

[Fleury 3]

if (totais[i].value != "") total += totais[i].value;

Muda para

if (totais[i].value != "") total += parseFloat(totais[i].value);

F.

[pedrovisk 1]

Muito obrigado!Deu certo. Mas como posso deixar o Valor Geral receber as casas decimais automaticamente como nos outros campos?

[Fleury 3]

if (totais[i].value != "") total += parseFloat(totais[i].value).fixed(2);

[pedrovisk 1]

Fleury,Alterei conforme sua indicação, mas ele retonar o seguinte no campo Total Geral: NaNPor favor, veja na página acima como ficou ou dá erro.

[Fleury 3]

Poxa amigo, desculpa, errei alí!Não é .fixed(2)O correto é .toFixed(2);F.

[pedrovisk 1]

Fleury,Fiz, mas continua saindo assim:Qtd = 8Valor Unitário = 1000Total do Produto = 8000.00Total Geral = 08000.00

[Fleury 3]

if (totais[i].value != "") total += parseFloat(totais[i].value).toFixed(2);

Se estiver exatamente assim não pode ser 0800.00

[pedrovisk 1]

Veja neste link como está:

http://www.fortalmag.com.br/2006/Orcamento...CodOrcamento=51

 

Veja como está o meu código:

 

function Somar(line) {  var Qtd = document.getElementById("Quant_"+line).value;  var ValorUnitario = document.getElementById("ValorUnitario_Z"+line).value;  var ValorProdTotal = parseFloat(Qtd) * parseFloat(ValorUnitario);  document.getElementById("ValorProdTotal_Z"+line).value = ValorProdTotal.toFixed(2); //AQUI FORMATO O CAMPO ValorProdTotal.toFixed(2)}function SomarTotais() {  var totais = document.getElementsByTagName("input");  var total = 0;  for (var i = 0; i < totais.length; i++) {	if (/^ValorProdTotal_Z/.test(totais[i].id))	  if (totais[i].value != "") total += parseFloat(totais[i].value).toFixed(2);  }  document.getElementById("TotalGeral").value = total;}

[Fleury 3]

faz assim então:

 

if (totais[i].value != "") total += parseFloat(totais[i].value);  }  document.getElementById("TotalGeral").value = total.toFixed(2);}

F.

[pedrovisk 1]

Muito obrigado!