Ir para conteúdo

POWERED BY:

Arquivado

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

skintape

[Resolvido] carregar em um campo3 o valor do campo1 ou campo2 de

Por , em Javascript

Recommended Posts

skintape    0

skintape
Postado

Preciso carregar em um campo3 o valor do campo1 ou campo2 de acordo com a opção selecionada de um input select. Funciona assim:

Tenho 2 campos de texto com valores diferentes e não-fixos (valor1 e valor2) e um terceiro chamado resultado. Acima deles, tenho um input select com 2 opções: opcao1 e opcao2. Ao selecionar a opçao1 no input select desejo que o valor1 seja carregado no campo "resultado", assim como o valor2 seja carregado no mesmo campo se eu selecionar a opcao2 no input select. Isso precisaria ser feito em jQuery.

 

Será que alguém poderia ajudar?

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

trabalhe com o evento onchange do select.

 

nele dispare uma function que lendo a propriedade .value do <select>, jogue o valor no atributo .value do input alvo.

Compartilhar este post

Link para o post
Compartilhar em outros sites

skintape    0

skintape
Postado

Willian, seria bom dar uma dica de como se monta essa parada, já tentei e não funciona. 

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Copia campos jQuery</title>
<script type="text/javascript" src="jquery-1.5.2.js"></script>
<script type="text/javascript">
$(document).ready(function() {
	$('#selects').select(function() {
	var selects = $('#selects').val();
	var resultado = $('#resultado').val();
	var valor1 = $('#valor1').val();
	var valor2 = $('#valor2').val(); 

	if(selects == 'primeiro') resultado = valor1;
	if(selects == 'segundo') resultado = valor2;

	});

});
</script>
</head>
<body>
<p><input type="text" id="resultado"></p>
<p><input type="text" id="valor1" value="primeiro lugar"></p>
<p><input type="text" id="valor2" value="segundo lugar"></p>
<p><select>
<option> - Selecione - </option>
<option value ="primeiro"> -primeiro- </option>
<option value ="segundo"> -segundo- </option>
</select>
</p>
</body>
</html>

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

Do que eu entendi, bastava isso:

 

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Copia campos jQuery</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("select[name='selecione']").change(function(){
	$("input[name='resultado']").val( $( this ).val() );
});
});
</script>
<style type="text/css">
label { display: block; }
</style>
</head>
<body>
<label><input type="text" name="resultado" /></label>


<label><select name="selecione">
	<option> - Selecione - </option>
	<option value="primeiro lugar"> -primeiro- </option>
	<option value="segundo lugar"> -segundo- </option>
</select></label>
</body>
</html>

 

resolve? ou você precisa jogar de acordo com oq tiver nos inputs mesmo ?

a 'dica' eu dei ali em cima.. só oque não dá, é pra eu ficar produzindo scripts de graça, sem ver o autor da dúvida mostrar que está tentando [não foi teu caso, mas acontece muito por aqui].

Compartilhar este post

Link para o post
Compartilhar em outros sites

skintape    0

skintape
Postado

Primeiramente, obrigado, muito obrigado mesmo pela disposição em ajudar. Que Deus abençoe a você e sua família.

Respondendo a sua pergunta: Os valores dos campos "valor1" e "valor2" não são fixos, como eu citei na descrição do tópico, irão variar de acordo com as páginas. Estava tudo certo no código anterior exceto por alguns detalhes: 

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Copia campos jQuery</title>
<script type="text/javascript" src="jquery-1.5.2.js"></script>
<script type="text/javascript">
$(document).ready(function() {
	$('#selects').change(function() {  /* Tinha colocado ".select(function()" mas é ".change(function()" */
	var selects = $('#selects').val();
	var resultado = $('#resultado').val();
	var valor1 = $('#valor1').val();
	var valor2 = $('#valor2').val(); 

	if(selects == 'primeiro') resultado = valor1;
	if(selects == 'segundo') resultado = valor2;

	$('#resultado').val(resultado);  /* Ficou faltando esta parte que procura o id "resultado" e inserie nele o valor resultado do input select*/
	});

});
</script>
</head>
<body>
<p><input type="text" id="resultado"></p>
<p><input type="text" id="valor1" value="primeiro lugar"></p>
<p><input type="text" id="valor2" value="segundo lugar"></p>
<p><select id="selects"><! - - - - Tinha esquecido de nomear o "id" deste input select como "selects". - - - >
<option> - Selecione - </option>
<option value ="primeiro"> -primeiro- </option>
<option value ="segundo"> -segundo- </option>
</select>
</p>
</body>
</html>

Agora sim! Funciona! :joia:

 

Como você faz pra deixar uma assinatura com o endereço do seu site nas respostas?

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