Mostrar e ocultar campos form com jQuery

[Fagner Campos 0]

E aí galera, tudo bem?

 

Preciso de uma ajuda de vocês. Sou totalmente novo no uso de jQuery e ultimamente estou com probleminha que não consigo solucionar.

 

Estou criando um formulário onde haverão algumas perguntas (usando radio) que, dependendo da resposta mostrará ou ocultará um campo.

 

Procurei na net algum código pronto, porém todos que encontrei necessitavam de adaptação, para se comportarem da forma que eu preciso. Aí que está o problema, não estou conseguindo fazer funcionar da forma que quero.

 

Não conheço muito bem a estrutura jQuery, estive olhando a documentação, mas não achei o que estava procurando. Até se alguém puder me responder, como faço comparação de valores de variáveis em jQuery?! tipo:

 

var a = 1;

 

var b = 2;

 

if ( a == b ) {...} //Não consegui achar como faz isso! rsrs

 

Mas a dúvida principal não é essa. Estou postando um exemplo de código que estou tentando adaptar. O que estou fazendo de errado?

 

$(document).ready(function(){

$(".botao").click(function() {

var ref = $(this).attr("alvo");

var acao = $(this).val();

	if($(acao) == "sim"){

		$("#"+ref).css("display", "block"); 

	} else {

		$("#"+ref).css("display", "none");

	}
});
});


opção 1 <input type="radio" name="filhos0a17" class="botao" alvo="conteudo1" value="sim">


<br />

opção 2 <input type="radio" name="filhos0a17" class="botao" alvo="conteudo1" value="nao">
<span id="conteudo1" style="display:none;">abc</span>

 

Valeu galera.

[William Bruno 1501]

acho q isso pode te ajudar:

http://wbruno.com.br/blog/2010/07/28/ocultarmostrar-elementos-apartir-de-radio-select/

 

leia o código sem jQuery(apenas js puro), está bem simples de entender.

[VultoBR 0]

Olá Fagner, tranquilo?

 

Para o seu código funcionar você deve alterar esta linha if($(acao) == "sim"){ para if(acao == "sim"){ a var acao já esta criada, então basta chama-la.

 

Vi que você esta utilizando alvo="conteudo1" como atributo do radio button, você nunca deve criar um novo atributo é totalmente invalido, você pode utilizar qualquer atributo para fazer esta ação, id, class, rel, title, entre outras =)

 

Abraços!

[D'Emery 0]

William Bruno, parabéns pelo artigo! Tá Show, mas ainda estou com uma dúvida, você colocou apenas um formulário simples. No caso se usasse um formulário grande, com diversos elementos e cada um deles modificasse esse formulário.

 

Vou citar um exemplo:

 

Tipo de Veículo: Moto / Carro

Marca do Veículo: Moto - Honda, Yamaha / Carro - Fiat, Ford

Modelo do Veículo: Moto - Honda - Pop 100, CB300; Yamaha - XTZ / Carro - Fiat - Palio, Uno; Ford - Ka, Fiesta, Focus

Motor: Moto - 100cc, 200cc, 250cc, 300cc, 400cc / Carro - 1.0, 1.3, 1.4, 1.6, 1.8, 2.0

Válvulas (somente para Carro): 8v, 16v, 20v

Combustível: Etanol / Gasolina / Diesel

Portas (somente para Carro): 2 portas / 3 portas / 4 portas

[William Bruno 1501]

sem problemas.

 

o exemplo é simples, e cada uma parte do form gigante é simples em si.

faça um de cada vez.

 

combos dependentes:

http://wbruno.com.br/blog/2009/10/06/combos-dependentes-ajax-jquery/