Ir para conteúdo

POWERED BY:

Arquivado

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

Kari

[Resolvido] Uma ideia

Por , em Javascript

Recommended Posts

Kari    0

Kari
Postado

Boa tarde , então eu não sou muito familiarizado com JS e AJAX estou aprendendo na marra e nos erros

ai eu queria fazer uma checkbox da seguinte maneira

quando eu clicka-se no "SIM"

chama-se um formlulário para preenchimento

com funções de js no formulário ativas

e sem o uso de jquery , já que como não sou esperiênte com JS ainda não quero usar as bibliotecas para ganhar mais experiência com js

tipo se me fala-sem quais eventos eventos e atributos que eu deveria usar já iria me ajudar bastante

e provavelmente isso que eu quero vai pedir AJAX porém como estou pedindo mais ajuda pro JS postei aqui msm

vlw e flw

Compartilhar este post

Link para o post
Compartilhar em outros sites

JCMais    75

JCMais
Postado

Crie o formulário e o deixe oculto na página (usando CSS: #myform {display:none}). Depois verifique o evento onchange do checkbox, quando ele for chamado, execute uma função que mostra o formulário.

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

quando eu clicka-se no "SIM"

chama-se um formlulário para preenchimento

não tem nada de ajax nisso.

http://wbruno.com.br/blog/2011/04/08/o-que-e-ajax-e-o-que-nao-e/

 

 

você vai usar o evento onclick do elemento checkbox, e alterar a propriedade display do formulario, de none para block

 

tão simples qnto isso.

Compartilhar este post

Link para o post
Compartilhar em outros sites

JCMais    75

JCMais
Postado

@Bruno, não seria melhor usar onchange? Por questões de acessibilidade, visto que algumas pessoas usam o teclado para preencher/percorrer o formulário (eu por exemplo), e assim o evento não seria ativado.

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

@Bruno, não seria melhor usar onchange?

não.

Por questões de acessibilidade,

exatamente por isso que em checkbox, é melhor que use onclick

 

visto que algumas pessoas usam o teclado para preencher/percorrer o formulário (eu por exemplo), e assim o evento não seria ativado.

o onclick é sim ativado, mas o onchange não. =)

 

<html>
<head>
<script type="text/javascript">
function id( el ){
return document.getElementById( el );
}
window.onload = function(){
id('check').onclick = function(){
	alert( 'onclick chamado!' );
}
id('check').onchange = function(){
	alert( 'onchange chamado!' );
}
}
</script>
</head>
<body>
<form action="" method="post">
	<label>Text: <input type="text" name="text1" /></label>
	<label>Text: <input type="text" name="text2" /></label>
	<label>Text: <input type="text" name="text3" /></label>
	<label>Checkbox <input type="checkbox" name="check" id="check" /></label>
</form>
</body>
</html>

 

o onchange só será executado qndo eu sair(mudar) do checkbox. Isso é oq conceitualmente o evento onchange diz.

o onclick é chamado pelo teclado normalmente.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Kari    0

Kari
Postado

Muito obrigado pela luz que vocês me deram

graças a ideia do hide e um exemplo da web

tive uma ideia e funcionou perfeitamente

 

Segue o codigo funcionando , provavelmente não da melhor forma porém funcional

call function


<form method="get" name="rOfertas" id="rOfertas">
	<label for="pOfertas">Você gostária de receber nossas ofertas por e-mail?</label>
		<input type="radio" name="vcQuer" value="Sim" onclick="callBack()" >Sim
		<input type="radio" name="vcQuer" value="Nao" onclick="getOut()" >Não
       </form>
	<form method="post" name="formPromo" id="formulario" class="hide"> 
		<fieldset style="border:none;">

 

função JS


function callBack(){
if(document.getElementById("formulario").className=="hide"){
	document.getElementById("formulario").className ="show";
	if(document.getElementById("promoRelogios").className=="show"){
		document.getElementById("promoRelogios").className = "hide";
	}	
}

}

function getOut(){
if(document.getElementById("formulario").className=="show"){
	document.getElementById("formulario").className ="hide";
	if(document.getElementById("promoRelogios").className=="hide"){
		document.getElementById("promoRelogios").className = "show";
	}
}

}

 

Novamente agradeço pela ajuda

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