1

HTML:

<select name="comboBox" id='comboBox'>
    <option value="--Seleccione--">--Seleccione--</option>
    <option value="Administrador">Administrador</option>
    <option value="Vendedor" >Vendedor</option>
    <option value="Empleado">Empleado</option>
</select>

Javascript

    $.getJSON(
      'trabajadoresAdmi/consultaTrabaAdmi.php',
      { accion: 'individual', identificador: numeroFila },
      function (todosLosDatos) {
        $.each(todosLosDatos, function (index, miVariable) {
          //va a iterar
          //  ...

          console.log(miVariable.tipoDeTrabajador)
          $("#comboBox option[value='" + miVariable.tipoDeTrabajador + "']").attr('selected', true);
          //  ...
        }) //each
      }, //esto es lo que se recibe de la consulta a MySQL
    ) //get

Contexto para este fragmento de código:

Tras una consulta a la BD con jQuery, cargo todos los datos de la consulta en inputs y en un select. La primera vez lo realiza bien, el problema viene al cancelar (cerrar el flotante) y elegir otra opción: realiza adecuadamente el llenado de los datos siempre y cuando la opción del select no esté repetida (sólo son 4 opciones, es rápido), ya que cuando se repite se queda estático en el último mostrado, coloqué un "console.log" para ver el valor (a colocar en el "select") y éste sí me lo muestra bien, pero no en el "select" (repito, una vez que ha mostrado todas las opciones -cuatro-) se queda estático en la última, igual si la modifico manualmente (eligiendo una), esta se selecciona y ya no cambia, al realizar una nueva consulta.

Es extraño, no realizo más acciones con ese elemento HTML (el "select")

1
  • Bienvenido a SO en español! He pulido un poco el texto, espero que no te moleste (puedes deshacer la edición en otro caso). Te recomiendo completar el recorrido de bienvenida para ganar tu primera medalla y conocer un poco más el sitio. Felicidades por tu primera pregunta, cumple bastante bien las directrices de Cómo preguntar e incluye un ejemplo mínimo verificable :) Commented el 10 may. 2022 a las 7:52

1 respuesta 1

0

Creo que el problema es porque lo estás haciendo de la manera más complicada: añadiendo el atributo selected a la opción que quieres seleccionar. ¿Por qué es la más complicada? Porque se te está olvidando quitar ese atributo al resto de opciones. Esto causa dos problemas:

  • Tienes varias opciones seleccionadas.
  • Si seleccionas algo que ya ha sido seleccionado, no se detecta el cambio (realmente no hay cambio, ya tenía el atributo selected) y por eso no se actualiza nada:

console.log('Esperamos 1,5 segundos...');

let values = ['Empleado', 'Administrador', 'Vendedor', 'Empleado']
const intervalId = setInterval(() => {
  $(`#comboBox option[value='${values.shift()}']`).attr('selected', true);
  console.log('cambio hecho');
  if (values.length === 0) {
    clearInterval(intervalId);
  }
}, 1500);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select name="comboBox" id='comboBox'>
    <option value="--Seleccione--">--Seleccione--</option>
    <option value="Administrador">Administrador</option>
    <option value="Vendedor" >Vendedor</option>
    <option value="Empleado">Empleado</option>
</select>

¿Cuál es la manera sencilla de hacerlo?

jQuery te permite trabajar con los select como si fueran un input "normal", pudiendo modificar su valor con el método val(<valor>):

console.log('Esperamos 1,5 segundos...');

let values = ['Administrador','Vendedor','Empleado','Administrador']
const intervalId = setInterval(() => {
  $('#comboBox').val(values.shift());
  console.log('cambio hecho');
  if (values.length === 0) {
    clearInterval(intervalId);
  }
}, 1500);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select name="comboBox" id='comboBox'>
    <option value="--Seleccione--">--Seleccione--</option>
    <option value="Administrador">Administrador</option>
    <option value="Vendedor" >Vendedor</option>
    <option value="Empleado">Empleado</option>
</select>

2
  • 1
    Muchas gracias, razonando la pregunta si es bastante torpe (me gustaría borrarla, jaja); por cierto aunque vengo de lenguajes tipados (y me cuesta algo comprender JS) bonito código -de ejemplo- conciso y funcional, saludos
    – user284695
    Commented el 10 may. 2022 a las 16:06
  • ¡No la borres! La pregunta no es torpe (de hecho está muy bien expuesta, no todo el mundo sabe exponer una duda correctamente y por eso la voté y respondí) y estoy seguro de que puede ser útil a otros que no están familiarizados con jQuery. Además, puedes marcar la respuesta como aceptada y conseguir un poco de reputación en el sitio y ganar otra medalla ;) Commented el 10 may. 2022 a las 17:33

Tu Respuesta

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