Caros Amigos,
Estou com uma dúvida que me atormenta tem uma semana e simplesmente travei por não conseguir resolver.
Tenho um site onde o cliente vai escolher, através de um formulário de registro, se ele vai necessitar ou não de um traslado até o evento. Caso ele escolha "Não", nada acontece. Caso ele escolha "Sim", eu quero que apareça o outro select com as opções de hotéis de onde ele vai se hospedar para pegar o traslado. Pois bem, eis meu código na parte de formulário:
<div class="col-md-6">
<div class="form-group">
<select class="form-control" name="traslado" id="traslado">
<option value="">Necessita Traslado?*</option>
<option value="Sim">Sim</option>
<option value="Não">Não</option>
</select>
</div>
</div>
<div class="col-md-6" id="teste">
<div class="form-group" style="display:none;">
<select class="form-control" name="hotel" id="hotel">
<option value="0">Se Sim, escolha o Hotel de Origem*</option>
<option value="SleepIn Jacarei">SleepIn Jacareí</option>
<option value="Ibis Jacarei">Íbis Jacareí</option>
<option value="Ibis SJC">Ibis SJC</option>
<option value="Novotel SJC">Novotel SJC</option>
</select>
</div>
</div>
Percebam que, ao responder "Sim" para a opção de "Traslado" eu quero que as opções de "Hoteis" apareçam juntamente com o outro grupo de select "form-control".
Pensei em duas formas de trabalhar:
A primeira seria manipulando a div do "form-control" relativo aos hoteis, ela fica oculta e ao clicar em Sim em "Traslado" ela aparece. (Tentei fazer, sem sucesso.)
A outra seria manipular o style "display:none", enfim, uma idéia que me ocorreu.
Fiz uns códigos em JavaScript porém nenhum funcionou, o que cheguei mais perto foi sumir o formulário todo.
Se alguém puder dar alguma dica e/ou solução ficarei enormemente agradecido.
Att,
