Ir para conteúdo

POWERED BY:

Arquivado

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

João Augusto

[Resolvido] Ação no select

Recommended Posts

Fala galera, to precisando mais uma vez da ajuda de você´s.....

Bom eu to precisando que a partir de uma escolha de uma opção dentro de um campo select ele faça uma ação de aparecer um input text....

Ou seja se determinada opção que o usuário escolher, aparece pra ele na tela um input pra ele poder digitar,se ele escolher outra o campo não apareceria....

Se alguém puder me ajudar....

vlw....

Compartilhar este post


Link para o post
Compartilhar em outros sites

Atenção

Este subfórum é destinado apenas para postagem de scripts prontos e testados para auxiliar os demais membros.

Não é permitido a abertura de tópicos com dúvidas. Para isso, use o Fórum de javascript.

É só trabalhar com onchange e DOM.

 

HTML

<select id="choice">
	<option value="remove">Renomear campo</option>
	<option value="add">Adicionar campo</option>
	<option value="edit">Alterar tipo de dado</option>
</select>
JavaScript

window.onload = createInput;

function createInput(){
	var iChoice = document.getElementById("choice");
	iChoice.onchange = function(){
		if(this.value == "add"){
			var input = document.createElement("input");
			input.setAttribute("type", "text");
			input.setAttribute("value", "Digite o novo conteúdo");
			document.body.appendChild(input);
		}
	}
}

Agora é só implementar a função.

 

Poderia ter feito de outra maneira: no HTML já criar o input e apenas deixa-lo com display: none. Quando o option fosse escolhido, você alterava com display: block.

 

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

Compartilhar este post


Link para o post
Compartilhar em outros sites

Agora é só implementar a função.

 

Poderia ter feito de outra maneira: no HTML já criar o input e apenas deixa-lo com display: none. Quando o option fosse escolhido, você alterava com display: block.

 

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

 

Eu vou tentar aqui,mais como eu faria pra subistituir o none por block? Teria que usar alguma função em Java??

vlw...

Compartilhar este post


Link para o post
Compartilhar em outros sites

Seria algo assim:

 

window.onload = createInput;

function createInput(){
	var iChoice = document.getElementById("choice");
	var input = document.getElementById("input");
	iChoice.onchange = function(){
		if(this.value == "add")
			input.style.display = "block";
		else
			input.style.display = "none";
	}
}

Onde está tendo dificuldades? A "mágica" está no onchange. ^_^

 

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

Compartilhar este post


Link para o post
Compartilhar em outros sites

Pow cara adorei teu script muito bom mesmo!!

Só que estou com alguns pequenos problemas;

 

usando o 1° js que você me passou o campo text está sendo inserido em lugar todo errado lá no final da página.E se voltar pra outra opção o campo não some.Se colocar novamente na opção "add" surge outro campo text;

 

usando o 2° js eu não consegui fazer com que o imput recebesse a ação de aparecer de acordo com a seleção feita pelo select.Fica dando na tela um erro de objeto necessário na parte do

input.style.display = "block";
......

 

No html eu estou colocando assim ve se está correto....

 

<tr>
                        <td height="20" align="right">Proporcional:</td>
                        <td colspan="2"><select id="choice">
        <option value="remove">Renomear campo</option>
        <option value="add">Adicionar campo</option>
        <option value="edit">Alterar tipo de dado</option>
</select></td>
                        <td align="right"><input type="text" id="choice" style="display: none;"></td>
                        <td> </td>
                      </tr>

Se puder me dar uma luz....

Fico no aguardo..

Vlw e obrigado pela atenção....

Compartilhar este post


Link para o post
Compartilhar em outros sites

Cara consegui mais dei uma pequena modificada no teu script e tb estava passando o ID errado pro campo text....

 

window.onload = createInput;

function createInput(){
        var iChoice = document.getElementById("choice");
        var input = document.getElementById("input");
                if(iChoice.value == "add")
					 input.style.display = "block";
                else
                        input.style.display = "none";
        }

Vlw brigadão pela ajuda e compreensão......

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

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