(Resolvido) Ajuda Formulário - opção no select faz aparecer outro camp

H&nrique · Novembro 14, 2008

E aí pessoal!

Já estou procurando solução sobre minha dúvida a algum tempo, como não encontrei o que precisava resolvi abrir este tópico.

Não tenho noções de Javascript.

Preciso que ao selecionar a opção "Estágio" apareça na linha abaixo o campo "Turno que Estuda" com um campo select que permita selecionar um dos três turnos mostrados no código.

O problema no código que envio é que se selecionar a opção estágio, mas depois optar pela opção profissional, o campo "turno que estuda" não desaparece. Ele desaparece somente se eu selecionar novamente estágio.

Peguei este código em um fórum , mas não consegui adaptar.

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<style>
/*estas classes css são necessarias para que o script funcione
corretamente*/
.show {
    display: block;
}
.hide{
    display: none;
}

</style>
<script type="text/javascript">
function Visibility(obj)
{
    if(typeof(obj) != Object)
        obj= document.getElementById(obj);
    
    var toggleVisibility = {
        hide: function(){obj.className = 'hide'},
        show: function(){obj.className = 'show';}
    }
    return{
        Toggle: function()
        {
                        toggleVisibility[(obj.className == 'show' ? 'hide': 'show')]();
        }    
    }    
}

window.onload = function(){
    document.getElementById('btnVisibility').onclick = Visibility('campo').Toggle;
}
</script>

<body>
<form>
<table width="100%" >
  <tr><td>Categoria:</td>
              <td>
              <select name="categoria" id="categoria">
              <option></option>
              <option value="estagio" id="btnVisibility">Estágio</option>
              <option value="profissional">Profissional</option>
              </select><div id="campo" class="hide"> Turno:<select name="turnoEstuda" id="turnoEstuda">
              <option></option>
              <option value="manha">Manhã</option>
              <option value="tarde">Tarde</option>
              <option value="noite">Noite</option>
              </select>
              </div><td></tr>
              </table>
</form>
</body>
</html>

.Andreia. · Novembro 14, 2008

primeiro seja bem vindo H&enrique.

quanto ao seu codigo, eu rodei aqui e não entendi, só aparece 1 combo

H&nrique · Novembro 21, 2008

primeiro seja bem vindo H&enrique.
quanto ao seu codigo, eu rodei aqui e não entendi, só aparece 1 combo

Consegui Resolver!

Valeu

<html>
<head>
<script>
function mostra() {
if(document.getElementById("turnoEstuda").style.display == "none")
{
    document.getElementById("turnoEstuda").style.display = "block";
        } 
        }
function esconde(){
if(document.getElementById("turnoEstuda").style.display == "block"){
         document.getElementById("turnoEstuda").style.display = "none";
         }
         else {
         document.getElementById("turnoEstuda").style.display = "none";
        } 
        }
        </script>
</head>
<body>
<table colspan="2">
<tr><td>Categoria:</td><td>
<select name="categoria" id="categoria">
<option value=""onClick="esconde()"></option>
<option value="estagio" onClick="mostra()">Estágio</option>
<option value="profissional" onClick="esconde()">Profissional</option>
</select>

<label id="turnoEstuda" style="display: none">Turno que Estuda:<select name="turnoEstuda">
<option value="manha">Manhã</option>
<option value="tarde">Tarde</option>
<option value="noite">Noite</option>
</select></label></td></tr></table></body></html>

Entrar

(Resolvido) Ajuda Formulário - opção no select faz aparecer outro camp

Pergunta

H&nrique

Link para o comentário

Compartilhar em outros sites

2 respostass a esta questão

Posts Recomendados

.Andreia.

Link para o comentário

Compartilhar em outros sites

H&nrique

Link para o comentário

Compartilhar em outros sites

Participe da discussão

Estatísticas dos Fóruns

Navegação

Atividades