I have set this code and when the user chooses cafe
in the <input type='search'>
field it should appear for example: Cimo, 3Corações, Utam
.
If the user chooses refrigerante
it should show in the field: Coca, Pespi, Tubaina
.
But these values should be shown in the placeholder.
Code:
<div class="container">
<div class="row">
<form id="contactForm" class="form-horizontal" method="POST" enctype="multipart/form-data">
<div class="col-sm-9">
<div class="col-sm-3 nav-container">
<div class="form-group">
<!-- <select id="evento" name="evento" onchange="campoSelect(this.value)" required> ... -->
<select class="form-control " id="tipo" name="tipo" onchange="campoSelect(this.value)" required>
<option value="" selected disabled>Selecione TIpo</option>
<option value="cafe">Cafe</option>
<option value="detergente">Detergente</option>
<option value="refiegerante">Refrigenrante</option>
</select>
</div>
</div>
<div class="col-sm-6">
<div class="input-group">
<input type="hidden" name="search_param" value="all" id="search_param">
<input type="text" class="form-control" name="x" placeholder="Search term...">
<span class="input-group-btn">
<button class="btn btn-primary" name="pesquisar" type="submit"><span class="glyphicon glyphicon-search"></span></button>
</span>
</div>
</div>
</div>
</form>
</div>
</div>
<script>
If (val = cafe){
mensagem = "Cimo, 3Corações,Utam";
}
If (val = refrigerante ){
mensagem = "Coca, Pespi,Cutuba";
}
function campoSelect(val){
document.getElementById("mensagem").placeholder = val;
}
</script>