Tengo un Problema me muestra los datos del otro select dependiente undefined
dejo el código
en Repository
public interface DepartamentoRepository extends JpaRepository<Departamento,Long>{
@Query("SELECT d.iddepartamento as iddepartamento, d.nomdepartamento as nomdepartamento FROM Departamento d where pais.idpais = :idPais")
List<Departamento> findByPais(@Param("idPais")Long idPais);
en interface Service
public interface DepartamentoService {
List<Departamento> departamentoLista();
Optional<Departamento> getDepartamento(Long iddepartamento);
Departamento agregarDepartamento(Departamento departamento);
String eliminarDepartamento(Long iddepartamento);
String actualizarDepartamento(Long iddepartamento);
List<Departamento> findByPais(Long idPais);
}
en la clase ServiceImpl
@Service
public class DepartamentoServiceImpl implements DepartamentoService {
private PaisRepository paisRepository;
private DepartamentoRepository departamentoRepository;
@Autowired
public DepartamentoServiceImpl(PaisRepository paisRepository, DepartamentoRepository departamentoRepository) {
this.paisRepository = paisRepository;
this.departamentoRepository = departamentoRepository;
}
@Override
@Transactional(readOnly=true)
public List<Departamento> findByPais(Long idPais) {
return departamentoRepository.findByPais(idPais);
}
}
en el Controller
private ClienteService clienteService;
private TipoClienteService tipoClienteService;
private PaisService paisService;
private DepartamentoService departamentoService;
private ProvinciaService provinciaService;
private DistritoService distritoService;
@Autowired
public ClienteController(ClienteService clienteService, TipoClienteService tipoClienteService,
PaisService paisService, DepartamentoService departamentoService, ProvinciaService provinciaService,
DistritoService distritoService) {
this.clienteService = clienteService;
this.tipoClienteService = tipoClienteService;
this.paisService = paisService;
this.departamentoService = departamentoService;
this.provinciaService = provinciaService;
this.distritoService = distritoService;
}
@GetMapping("/cliente")
public String clienteLista(Model model) {
model.addAttribute("clientes",clienteService.listaCliente());
model.addAttribute("tipoclientes",tipoClienteService.tClienteLista());
model.addAttribute("paises",paisService.paisLista());
return "venta/cliente";
}
@RequestMapping(value="cargarPais/{idpais}",method = RequestMethod.GET)
@ResponseStatus(HttpStatus.OK)
@ResponseBody
public String cargarPais(@PathVariable("idpais") Long idpais, HttpServletResponse response) {
Gson gson=new Gson();
response.setContentType("text/plain;charset=UTF-8");
return gson.toJson(departamentoService.findByPais(idpais));
}
en el JS
$(document).ready(function(){
$('.myForm14 #comboboxPais').on('change', function(){
var idPais= $('.myForm14 select#comboboxPais option:selected').val();
alert(idPais);
$.getJSON({
ajax : 'true',
url:'../venta/cargarPais/' + idPais ,
success: function(data,statusText){
var data = $.parseJSON(data);
var html= '<option value="">Seleccione Departamento</option>';
for(var i=0; i< data.length; i++){
html += '<option value="' + data[i].iddepartamento + ' " >' +data[i].nomdepartamento + '</option>';
}
alert(data);
html += '</option>';
$('.myForm14 select#comboboxDepartamento').html(html);
},
error: function(ob,errStr) {
alert('error');
console.log(ob,errStr);
}
});
});
});
En JSP
<div class="myForm14">
<form:form action="${path}/venta/cliente" method="post"
modelAttribute="paises">
<div class="form-group row">
<label for="pais" class="control-label col-md-2">Pais</label>
<div class="col-md-2">
<select id="comboboxPais" >
<option value="-1">Seleccione Pais</option>
<c:forEach items="${paises}" var="pais">
<option value="${pais.idpais}">${pais.nompais}</option>
</c:forEach>
</select>
</div>
<label for="comboboxDepartamento" class="control-label col-md-2">Departamento</label>
<div class="col-md-2">
<select id="comboboxDepartamento" >
<option value="-1">Seleccione Departamento</option>
</select>
</div>
</div>
</form:form>
</div>
Me muestra cuando coloco la siguiente url: http://localhost:9090/proyecto/venta/cargarPais/1
[[1,"Lima"],[3,"Ayacucho"]]
pero en la url: http://localhost:9090/proyecto/venta/clientes
el log de salida es:
Written [[[1,"Lima"],[3,"Ayacucho"],[4,"Arequipa"]]] as "application/json" using [org.springframework.http.converter.json.GsonHttpMessageConverter@5fc3ca2d]
Cuando selecciono país del combo me muestra el siguiente combo pero con datos unidifined departamento por ejemplo si selecciono un país me tiene que enlazar sus departamentos correspondientes pero no me muestra nada espero que alguien de la comunidad me pueda apoyar en solucionar este problema. estoy investigando.