Ir para conteúdo

POWERED BY:

Arquivado

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

pinoc

Exibir div

Por , em Javascript

Recommended Posts

pinoc    2

pinoc
Postado

Opa.

 

Seguinte tenho um form, que ao clicar no botão preciso que ele exiba outro form e esconda o atual.

Como fazer isso?

 

Não manjo muito de js

Compartilhar este post

Link para o post
Compartilhar em outros sites

pinoc    2

pinoc
Postado

Existe tantos jeitos de se fazer isso..

 

 //to fazendo esse codigo aqui só para mostrar;
 $(function(){

})

 

Lampaed

 

E qual seria o codigo?

Compartilhar este post

Link para o post
Compartilhar em outros sites

Lampaed    1

Lampaed
Postado

Existe tantos jeitos de se fazer isso..

 

Talvez sejá melhor você utilizar o evento Submit

 

Exibe o primeiro Formulario.

Quando click para Enviar evento OnSubmit.

você faz a requisição AJAX para esse dados ou apenas grava ele em um JSON,

e adiciona um display none no folha de estilo (CSS), e depois da um display block no segundo formulario que vai estar Invisivel.

assim quando você enviar o 2 formulario adiciona um AJAX enviando as informações contidas no Formulario.

 

Sera que deu para compreender?

Compartilhar este post

Link para o post
Compartilhar em outros sites

pinoc    2

pinoc
Postado

Existe tantos jeitos de se fazer isso..

 

Talvez sejá melhor você utilizar o evento Submit

 

Exibe o primeiro Formulario.

Quando click para Enviar evento OnSubmit.

você faz a requisição AJAX para esse dados ou apenas grava ele em um JSON,

e adiciona um display none no folha de estilo (CSS), e depois da um display block no segundo formulario que vai estar Invisivel.

assim quando você enviar o 2 formulario adiciona um AJAX enviando as informações contidas no Formulario.

 

Sera que deu para compreender?

 

Entendi sim.

Mais saberia me dizer como fazer isso na pratica?

Compartilhar este post

Link para o post
Compartilhar em outros sites

josewilson    0

josewilson
Postado

Acho que isso é o que você queria

 

Esqueça as CSS é que eu não consigo fazer algo sem estar bem organizado :)

 

<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="utf-8"/>
<title>Formulário</title>
<style type="text/css">
*{margin:0;padding:0;font-family:Tahoma, Geneva, sans-serif;color:#333;}
form{margin:auto;width:500px;height:250px;background-color:#CCC;margin-bottom:10px;padding:10px;display:none;}
input{padding:4px;border:1px solid #999;}
label{display:block;margin-top:8px;}
h1{font-size:18px;}
div{width:500px;height:80px;background-color:#CCC;margin:auto;padding:10px;margin-top:10px;margin-bottom:10px;}
</style>
</head>
<body>
   <div>
       <h1>Tipo do cliente:</h1>
       <label>Físico: <input type="radio" id="f" name="escolha"/></label>
       <script>
       document.getElementById('f').onclick = function() 
       {
           document.getElementById('one').style.display = 'block';
           document.getElementById('two').style.display = 'none';
       } 
       </script>
       <label>Jurídico: <input type="radio" id="j" name="escolha"/></label>
       <script>
       document.getElementById('j').onclick = function() 
       {
           document.getElementById('two').style.display = 'block';
           document.getElementById('one').style.display = 'none';
       } 
       </script>
   </div>
   <form id="one">
       <h1>Formulário 1</h1>
       <label>CPF: <input type="text" required /></label>
       <label><input type="submit" value="Cadastrar" /></label>
   </form>
   <form id="two">
       <h1>Formulário 2</h1>
       <label>CNPJ: <input type="text" required /></label>
       <label><input type="submit" value="Cadastrar" /></label>
   </form>
</body>
</html>

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