Estou tentando criar um form em uma pagina, e dentro desse form eu tenho 2 selects populados com valores do banco, mas eu gostaria que, de acordo com a seleção do primeiro select, o segundo mostrasse apenas os valores relacionados.
Por exemplo: Eu tenho clientes e veiculos, os veiculos pertencem aos clientes, então, quando eu selecionasse o cliente, o select de veiculos mostraria apenas os veiculos do cliente selecionado.
Aqui vai meu codigo
Controller:
@RequestMapping(path= "/getVagas/{codigo}", method = RequestMethod.GET)
@ResponseBody
public String findveiculo(@PathVariable(value = "codigo") Long codigo, Model model) {
List<Veiculo> lista = veiculoDao.filtraPorCliente(codigo);
Gson gson = new Gson();
String listaToString = gson.toJson(lista);
System.out.println(lista);
return listaToString.toString();
}
JSP:
<select class="form-control" name="cliente" size="1" id="cliente">
<option>Selecione o cliente</option>
<c:forEach var="c" items="${clientes}">
<option value="${c.codigo}">${c.nome}</option>
</c:forEach>
</select>
<select class="form-control" name="veiculo" size="1" id="veiculo">
<option>Selecione a placa do veiculo</option>
</select>
AJAX:
$('#cliente').change(function(e){
var cliente = $('#cliente').val();
$.ajax({
type: "GET",
url: "http://localhost:8080/SistemaEstacionamento/vaga/getVagas/" + cliente,
success: function(listaVeiculos){
//adiciona a option aqui
console.log(listaVeiculos);
},
error: function(erro){
console.log(erro);
}
});
});
Desde já, agradeço
