I am using a method that loads information from a database in a combobox, but what is shown depends on the previous selection in another combobox ... A dynamic combobox.
It happens to work perfectly in Mozilla Firefox (v.54.0) but does not work in Chrome (v.59.0). I tried different versions of Jquery and it is not solved.
I leave the code js and the implementation. It is worth mentioning that I am using Laravel 5.4.
JS
function loadContent(url, destino, qs) {
var spinner = "Cargando...";
var destino = jQuery('#' + destino);
destino.html(spinner);
jQuery.ajax({
type: "get",
url: url,
dataType: 'html',
data: qs,
timeout: 30000,
error: function (xhr, ts, et) {
alert("Error al cargar la pagina"+"et="+et);
destino.html('');
},
success: function (data, ts) {
window.setTimeout(function () {
destino.html('');
destino.html(data);
}, 500);
}
});
}
PHP.
<select name="empresa_id" id='empresa_id' class='form-control'>
<option value="">Seleccione una opcion</option>
@foreach($empresa as $emp)
<option value="{{$emp->id}}" onclick="loadContent('<?php echo route('getsuc', $emp->id)?>', 'sucursal')">{{$emp->nombre}}</option>
@endforeach
</select>
<select name="empresa_id" id='sucursal' class='form-control'>
<option value=''>Seleccione una Empresa</option>
</select>
<script type="text/javascript" src="{{asset('js/jquery-3.2.1.js')}}">
</script>
<script type="text/javascript" src="{{asset('js/load_content.js')}}">
</script>
Response to Gerardo Rosciano
<select name="empresa_id" id='empresa_id' class='form-control' onchange="loadContent('<?php echo route('getsuc', this.value)?>', 'sucursal')">
<option value="">Seleccione una opcion</option>
@foreach($empresa as $emp)
<option value="{{$emp->id}}">{{$emp->nombre}}</option>
@endforeach
</select>
<select name="sucursal_id" id='sucursal' class='form-control'>
<option value=''>Seleccione una Empresa</option>
</select>
<script type="text/javascript" src="{{asset('js/jquery-3.2.1.js')}}">
</script>
<script type="text/javascript" src="{{asset('js/load_content.js')}}">
</script>