0

Buenas noches no se muy bien como ejecutar esto, para que en mi iteración de values que hago con append, detectar con una variable global cual está seleccionado.

Este es mi append

$('#zonasGuardaTicket').append('<option value="'+ mesas[i].id +'">'+ mesas[i].mesa +' - ('+ posicion +')</option>');

Luego tengo una variable global que se llama mesaID.

Quiero hacer algo como esto, que habitualmente hago en php:

{{ ( $mesa->id== $local->mesaID) ? 'selected' : '' }}

Es esto posible con jquery??

2 respuestas 2

1

$(document).ready(function(){
  var messageId = "3";
  var options = {
    1: "opción 1",
    2: "opción 2",
    3: "opción 3",
    4: "opción 4",
    5: "opción 5",
    6: "opción 6"
  }; 
  
  $.each(options,function(key,value){
    $("#selector").append('<option value="'+key+'"'+ (key == messageId ? 'selected' : '')+'>'+value+'</option>');
  });
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js" integrity="sha384-7+zCNj/IqJ95wo16oMtfsKbZ9ccEh31eOz1HGyDuCQ6wgnyJNSYdrPa03rtR1zdB" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js" integrity="sha384-QJHtvGhmr9XOIpI6YVutG+2QOK9T+ZnN4kzFN1RtK3zEFEIsxhlmWl5/YESvpZ13" crossorigin="anonymous"></script>
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
<div>Si quieres que se seleccione al indicar una opción, modifica la variable messageId. Se puede establecer los números comprendidos del 1 al 6.</div>
<br>
<div class="col-md-6 col-sm-12 col-xs-6">
<select id="selector" class ="form-select" aria-label="Selecciona una opción">
<option selected>Selecciona una opción</option>
</select>
</div>

Para acceder a la opción seleccionada por el usuario a partir de un selector, puedes usar los selectores de Jquery. En este código que te indico, se selecciona las opción seleccionada por el usuario para el elemento select con id zonasGuardaTicket.

 $('#zonasGuardaTicket>option:selected')
5
  • ¿Cómo funciona este código?, ¿Qué es lo que hace?, ¿Cómo resuelve el problema de OP?. Es mejor dar respuestas explicando siempre el código que se propone para que más usuarios puedan comprenderla. ;)
    – Israel-ICM
    Commented el 9 nov. 2021 a las 12:41
  • @Israel-ICM tienes toda la razón. Modificada la respuesta.
    – rubenchus
    Commented el 9 nov. 2021 a las 12:52
  • Hola @rubenchus perdona la tardanza pero me tube que poner a otras cosas, pero como comparo ahí con mi variable mesaID ??
    – Miguel
    Commented el 23 nov. 2021 a las 20:16
  • Hola @Miguel te he dejado un ejemplo de lo que me pides. Espero que te ayude.
    – rubenchus
    Commented el 6 dic. 2021 a las 18:40
  • Funciona perfecto @rubenchus muchas gracias!
    – Miguel
    Commented el 20 dic. 2021 a las 17:15
0

Necesitas utilizar el atributo selectedIndex para ubicar la posición de la opción seleccionada dentro del conjunto de opciones, al cual accedes a través del atributo options.

miSelectBox.options[miSelectBox.selectedIndex]

Una vez que ya tienes eso, puedes acceder a todos los atributos y valores de dicha opción.

4
  • Hola @Alexis88 no comprendo bien, y como utilizo mi variable global ahí?
    – Miguel
    Commented el 7 nov. 2021 a las 12:55
  • Según veo en el ejemplo en PHP, si dos determinados valores son iguales, asignas el valor selected a lo que me imagino es un <opción>. Con lo que te indiqué, directamente detectas la opción que se encuentra seleccionada, algo que con PHP no se puede hacer directamente porque no es un lenguaje del lado del cliente. Si eso no es lo que buscas, por favor, explica un poco mejor lo que necesitas.
    – user255960
    Commented el 7 nov. 2021 a las 15:17
  • Hola @Alexis88 . Lo que busco es que en ese select vienen distintos valores, en una variable global guardo yo la id del selector que quiero que este como selected, me comprendes algo mejor así?
    – Miguel
    Commented el 7 nov. 2021 a las 16:32
  • Si la ID ya la tienes de forma predeterminada, entonces puedes recorrer el listado de opciones desde miSelectBox.options, en donde miSelectBox es el <select>, y en cada iteración del bucle comparar el valor predeterminado del ID con la propiedad value de cada <option>. Una vez que identifiques la opción, solo te queda asignarle el valor true a la propiedad selected.
    – user255960
    Commented el 7 nov. 2021 a las 18:04

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.