Ir para conteúdo

POWERED BY:

Arquivado

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

Tellys Castro

imprimir campos de formulario com javascript

Por , em Javascript

Recommended Posts

Tellys Castro    12

Tellys Castro
Postado

queria um sistema asssim:to com um select com 2 opçoes, sim e naose eu selecionar o sim, nao precisa de mais nda porem quando eu seleceionasse o nao ai abrisse um novo campo de formulario em baixo , tipo assim, se o cara escolheu nao, gostaria d saber o pq.em suma queria q quando eu selecionace determinado select, imprimisse um campo de texto abaixoatebrigado galera

Compartilhar este post

Link para o post
Compartilhar em outros sites

rodrigofb    0

rodrigofb
Postado

Saudações, amigo....

existe uma maneira bem simples mesmo, de se criar um campo, utilizando DOM.

 

Dá uma olhada.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /><title>::. Exemplo criar campo .::</title><script type="text/javascript">function verifica(valor){	if(valor == "nao"){		var campo = document.createElement('input');		campo.setAttribute('id','motivo');		campo.setAttribute('name','motivo');		campo.style.display = 'block';	document.getElementById('motivoOpcao').appendChild(campo);		document.getElementById('motivoOpcao').style.display = 'block';	}else{		document.getElementById('motivoOpcao').style.display = 'none';	}}</script></head><body><form action="" method="post" name="form" id="form">	<select name="escolha" id="escolha" onchange="verifica(this.value)">		<option value="0" selected="selected">Escolha uma opção</option>		<option value="nao">Não</option>		<option value="sim">Sim</option>		</select>	<br /><br />	<div id="motivoOpcao" style="display:none"></div>	</form></body></html>

Bom, vamos la...

primeiro, no select, a gente adiciona um evento para chamar a função:

onchange="verifica(this.value)"

Esse evento chama a nossa função que faz toda a 'mágica':

function verifica(valor){	if(valor == "nao"){						var campo = document.createElement('input');		campo.setAttribute('id','motivo');		campo.setAttribute('name','motivo');			document.getElementById('motivoOpcao').appendChild(campo);		document.getElementById('motivoOpcao').style.display = 'block';	}else{		document.getElementById('motivoOpcao').style.display = 'none';	}}

verificando qual a opção escolhida:

if(valor == "nao"){

utilizando DOM para criar o elemento do tipo "input":

var campo = document.createElement('input');

criando atributos no campo recém criado:

campo.setAttribute('id','motivo');campo.setAttribute('name','motivo');

e, agora, vamos inserir o nosso campo criado, dentro da camada 'motivoOpcao':

document.getElementById('motivoOpcao').appendChild(campo);
poderíamos ter colocado simplesmente, document.getElementById('motivoOpcao').innerHTML = campo;

mas, para os padrões da web atual, a melhor maneira se inserir um objeto dentro da página, é com

appendChild, já nos padrões mais modernos, digamos. InnerHTML não está errado,

mas já existe uma maneira melhor, mais correta de se fazer.

 

e, por fim, deixando a camada que aparecerá o campo, visível:

document.getElementById('motivoOpcao').style.display = 'block';

 

Espero ter ajudado...

qualquer coisa...

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