Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

marcossantana10

Preencher input 2 de acordo com input1

Por , em Javascript

Recommended Posts

marcossantana10    0

marcossantana10
Postado

Tô fazendo um sistema aqui que queria preencher um campo do formulário de acordo com outros dois, exemplo:

 

Tenho um campo "Quantidade" e um campo "Valor unitario". O que queria fazer era preencher o terceiro campo - "Valor total" - com o resultado da multiplicação.

 

OBS: Isso "em tempo real". A medida que eu mude um dos dois primeiros campos, o terceiro também muda exibindo esse resultado.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Richardsoncsc    4

Richardsoncsc
Postado

por favor tente algo desse tipo em java scritp

faça num projeto teste depois coloque no seu

espero ter ajudado

 

obs.:: poe onchange nos dois campos

<script language="javascript">
function teste(){
var qtd = document.getElementById("qtd").value;
var preco = document.getElementById("preco").value
var total = document.getElementById("qtd").value = qtd*preco;
}
</script>
<input type="number"  id="qtd" onchange="teste();"/>

Compartilhar este post

Link para o post
Compartilhar em outros sites

LandersonAlmeida    31

LandersonAlmeida
Postado

Usa jquery, fiz rapidinho mas ta funcional :P :

<input type="text" class="input1" placeholder="Campo 1  =)">
<input type="text" class="input2" placeholder="Campo 2  =)">

<script type="text/javascript">
	$(document).ready(function(){
		var Campo1 = $("input.input1");
		var Campo2 = $("input.input2");

		$(Campo1).keyup(function(){
			if(isNumber($(this).val())){
				if(isNumber($(Campo2).val())){
					var Mult = $(Campo1).val() * $(Campo2).val();

					alert(Mult);
				}
			}
		});

		$(Campo2).keyup(function(){
			if(isNumber($(this).val())){
				if(isNumber($(Campo1).val())){
					var Mult = $(Campo1).val() * $(Campo2).val();

					alert(Mult);
				}
			}
		});

		//Verificamos se o que foi digitado é numero
		function isNumber(n) {
			return !isNaN(parseFloat(n)) && isFinite(n);
		}
	});
</script>

Compartilhar este post

Link para o post
Compartilhar em outros sites

marcossantana10    0

marcossantana10
Postado

Nenhum dos dois funcionaram, acho que na verdade vocês não entenderam a proposta.

 

Teria três campos

quantidade

valor unitário

valor total

 

Onde eu ia digitar a quantidade, depois o valor unitário e ele preencheria o terceiro campo pra mim, de acordo com o resultado da multiplicação dos dois anteriores.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Richardsoncsc    4

Richardsoncsc
Postado

na verdade os dois estao certos, da um conferida ai meninho.

o do rapaz ta mais profissional mas os dois funcionam

Nenhum dos dois funcionaram, acho que na verdade vocês não entenderam a proposta.

 

Teria três campos

quantidade

valor unitário

valor total

 

Onde eu ia digitar a quantidade, depois o valor unitário e ele preencheria o terceiro campo pra mim, de acordo com o resultado da multiplicação dos dois anteriores.

 

OBS.: ele usa JQuery e eu JS puro

Compartilhar este post

Link para o post
Compartilhar em outros sites

marcossantana10    0

marcossantana10
Postado

na verdade os dois estao certos, da um conferida ai meninho.

o do rapaz ta mais profissional mas os dois funcionam

 

OBS.: ele usa JQuery e eu JS puro

 

Amigo, o que eu tenho que fazer no seu pra funcionar?

Devo criar os três inputs e chamar a função no onchange para os tres?

Compartilhar este post

Link para o post
Compartilhar em outros sites

Richardsoncsc    4

Richardsoncsc
Postado

 

Amigo, o que eu tenho que fazer no seu pra funcionar?

Devo criar os três inputs e chamar a função no onchange para os tres?

segue html completo

<!DOCTYPE html>
<html>
    <head>
        <title>TODO supply a title</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <script language="javascript">
            function calcula(){
                var quantidade = document.getElementById("qtd").value;
                var preco = document.getElementById("preco").value;
                var total = document.getElementById("resultado").value = quantidade * preco;
                
            }
            
        </script>
    </head>
    <body>
        Quantidade: <input type="number" id="qtd" onchange="calcula();"> Preço<input type="number" id="preco" onchange="calcula();">  = 
        <input type="text" id="resultado">
    </body>
</html>

Compartilhar este post

Link para o post
Compartilhar em outros sites

marcossantana10    0

marcossantana10
Postado

 

segue html completo

<!DOCTYPE html>
<html>
    <head>
        <title>TODO supply a title</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <script language="javascript">
            function calcula(){
                var quantidade = document.getElementById("qtd").value;
                var preco = document.getElementById("preco").value;
                var total = document.getElementById("resultado").value = quantidade * preco;
                
            }
            
        </script>
    </head>
    <body>
        Quantidade: <input type="number" id="qtd" onchange="calcula();"> Preço<input type="number" id="preco" onchange="calcula();">  = 
        <input type="text" id="resultado">
    </body>
</html>

Isso mesmo. Muito obrigado!!!

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito