Estou tentando fazer que quando o usuário selecionar o select
de id origem, e estiver a seleção "Cliente" o div
de id "cli" receber display:block
.
Para isso eu fiz um teste, de quando acionar o evento onchange
do id origem, dar um toogle
no div
de id cli, mostrando ou escondendo.
Como faço entao para quando estiver o select
selecionado com valor "Cliente" fazer aparecer, e se não for, fazer esconder.
Código:
<div class="col-md-4" >
<div class="form-group">
<label class="formLabel" for="origem">Origem</label>
<select name="origem" id="origem" class="form-control formSelect" onchange="origem()" required>
<option value=""></option>
<option value="Cellsystem">Cellsystem</option>
<option value="Santosfilho">Santosfilho</option>
<option value="Cliente">Cliente</option>
<option value="Licitacao">Licitação</option>
<option value="Leilao">Leilão</option>
<option value="Mercado Livre">Mercado Livre</option>
</select>
</div>
<div class="form-group">
<label class="formLabel" for="prioridade">Prioridade</label>
<select name="prioridade" id="prioridade" class="form-control formSelect" required>
<option value="baixa">Baixa</option>
<option value="media" selected>Normal</option>
<option value="alta">Alta</option>
</select>
</div>
</div>
<div class="col-md-4">
<div class="col-md-12 cli" id="cli">
<div class="form-group">
<label style="width:50%;text-align:left;font-weight:normal;color:#FF5C5C;" class="formLabel" for="nfvenda">NF</label>
<label style="width:50%;text-align:center;font-weight:normal;color:#FF5C5C;" class="formLabel" for="datanfvenda">Data de emissão</label>
<input style="width:49%;" type="text" class="form-control formInputFL" name="nfvenda" id="nfvenda" >
<input style="width:49%;" type="text" class="form-control formInputFR" name="datanfvenda" id="datanfvenda" >
</div>
<div style="clear:both;height:10px;"></div>
<div class="form-group">
<label style="font-weight:normal;color:#FF5C5C;" class="formLabel" for="danfe">DANFE</label>
<input type="text" class="form-control formInput" name="danfe" id="danfe" >
</div>
<div class="form-group">
<label style="color:#FF5C5C;" class="formLabel" for="cliente">Quem é o Cliente ? </label>
<input type="text" class="form-control formInput" name="cliente" id="cliente" >
</div>
</div>
</div>
Segue o Javascript:
function origem() {
$( "#cli" ).slideToggle("fast", function() {});
}