How do I get the last two "teacher" and "enrollment" fields to appear only after the "Type" field has been selected?

Navigation
0

How to make the last two "teacher" and "enrollment" fields only appear after you have selected the field option above "Type" ?? 

<br/><br/>
Tipo:<b>*</b><br/>
<select id="tipo" name="tipo" required>
  <option value=""></option>
  <option value="Titular">Titular</option>
  <option value="Substituto">Substituto</option>
  <option value="Substituto CTD">Substituto CTD</option>
  <option value="Aula Atividade">Aula Atividade</option>
</select>
<br/><br/>
Professor:<b>*</b><br/>
<input id="nomeProfEfetivo" name="nomeProfEfetivo" required>
</input>
<br/><br/>
Matricula:<b>*</b><br/>
<input id="matricula" name="matricula" required>
</input>
<br/><br/>
    
asked by anonymous 17.04.2017 / 22:31

2 answers

0
<html>
    <head>  

        <script type="text/javascript">
        function visible(name) 
            {
                var mydiv =  document.getElementById("d");
                mydiv.style = "show";
            }
        </script>
    </head>
    <body>
        Tipo:<b>*</b><br/>
        <select id="tipo" name="tipo" onchange="visible('d')" required>
            <option value=""></option>
            <option value="Titular">Titular</option>
            <option value="Substituto">Substituto</option>
            <option value="Substituto CTD">Substituto CTD</option>
            <option value="Aula Atividade">Aula Atividade</option>
        </select>

        <div id="d" style="display: none">
            Professor:<b>*</b><br/>
            <input id="nomeProfEfetivo" name="nomeProfEfetivo" required>
            </input><br/>   

            Matricula:<b>*</b><br/>
            <input id="matricula" name="matricula" required>
            </input>    
        </div>
    </body>
</html>
    
18.04.2017 / 13:16
1

You will need javascript with event change and show to show: 

$("#tipo").change(function() {
  $('#teste').show();
});

Html: 

<div id="teste" hidden>
  Professor:<b>*</b>
  <br/>
  <input id="nomeProfEfetivo" name="nomeProfEfetivo" required>
  <br/>
  <br/> Matricula:
  <b>*</b>
  <br/>
  <input id="matricula" name="matricula" required>
</div>

JSfiddle: link

Source: link and link

    
17.04.2017 / 22:50
Send value of a Javascript variable to PHP Regular expression to deny everything other than social reason