1

Estoy usando un metodo que carga informacion de una base de datos en un combobox, péro lo que se muestra depende de la seleccion previa en otro combobox... Un combobox dinamico.

Sucede que funciona perfectamente en Mozilla Firefox (v.54.0) pero no funciona en Chrome (v.59.0). Probé con versiones distintas de Jquery y no se soluciona.

Dejo el codigo js y la implementacion. Cabe mencionar que estoy usando 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>

Respuesta a 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>

1 respuesta 1

3

Los eventos onclick en option no funcionan en la mayoria de las versiones de IE, Safari y chrome Mas info (en ingles)

Para obtener funcionalidad en los <select> se aconseja usar el evento onChange

<select name="empresa_id" id='empresa_id' class='form-control'
 onchange="loadContent(this.value, 'sucursal')" >
    <option value="">Seleccione una opcion</option>
  @foreach($empresa as $emp)
    <option value="<?php echo route('getsuc', $emp->id)?>">{{$emp->nombre}}</option>
  @endforeach
</select>

Más sobre el evento onChange:

https://www.youtube.com/watch?v=RpXP6KaLjd4

https://www.w3schools.com/jsref/event_onchange.asp (ingles)

http://www.w3im.com/es/jsref/event_onchange.html

5
  • Muchas gracias, funciono tanto en chrome como en Firefox. Ahora el problema es obtener en el <select> el valor del <option> seleccionado y reemplazarlo por el "$emp->id" establecido el route. Tienes alguna idea? Commented el 16 jun. 2017 a las 17:45
  • Hola Israel, this.value en el onchange deberia enviarte el valor almacenado en value="" de cada option. No es eso lo que necesitas? que estaría faltando? Commented el 16 jun. 2017 a las 17:54
  • Exactamente es eso lo que necesito. El problema es que dentro del onchange necesito colocar route, para hacer alucion a una funcion dentro de mi controlador, a esta funcion debo darle como parametro la id de la empresa y he intentado con el this value y me genera el sgte error cuando, como parametro del route, le ingreso el this.value: -"Use of undefined constant this - assumed 'this' "-... Editare la publicacion con el codigo de la implementacion. Commented el 16 jun. 2017 a las 18:07
  • Israel, fijate el codigo de mi respuesta. Estoy usando tu echo route en el option value, para que despues loadContent use this.value. en el codigo que te puse this.value TIENE el valor de url que necesitas. A tu codigo original de JS, agregale el PHP de mi respuesta y deberia funcionar bien. Probalo y avisanos. Commented el 16 jun. 2017 a las 18:48
  • Efectivamente el codigo que enviaste en un comienzo funciona a la perfeccion, fue un problema mio de entendimiento. Muy agradecido por la ayuda y tu tiempo. Commented el 16 jun. 2017 a las 18:54

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.