Select2

Select2 es un plugin jQuery que nos permite tener un selector de elementos con un cuadro de búsqueda poniendo así más sencillo encontrar lo que desea seleccionar el usuario. Es muy útil sobre todo en selectores donde se ofrecen infinidad de opciones, como por ejemplo un selector de país o ciudad.

Es un plugin muy parecido al de Chosen que ya hemos hecho mención en anteriores posts pero este incorpora más opciones o al menos su documentación es más extensa pareciendo ser mucho más completo.

Se puede implementar un selector múltiple como el que vemos en la imagen siguiente de forma muy sencilla:

select2

Ver varios ejemplos en funcionamiento

En la documentación oficial del plugin podrán observar la infinidad de opciones que disponen y ver más ejemplos.

Ver más documentación

Autor
Escrito por Jose Aguilar - Director ejecutivo y tecnológico en JA Modules. Experto programador PrestaShop y Experto programador WordPress.
Te ha servido? Valora esta entrada!
(10 votos, promedio: 5 de 5)
Comparte en las redes sociales
¿Buscas trabajo de programador?

12 respuestas a “Select2”

  1. Luis Palomino dice:

    No puedo cargar los datos en el select2 al hacer la función editar, tendrán algún ejemplo?

    • Jose Aguilar dice:

      Hola,

      Lamentamos decir que no tenemos ningún ejemplo con editar y mantener los datos. Si usas PHP, tienes que tenerlos presente en el código html para hacer una condición para seleccionar aquellos elementos en el selector que están marcados. Para marcar una opción en el selector es algo así:

      Espero te sirva,
      Saludos

  2. Vanesa dice:

    No me funciona cuando los campos son añadidos dinámicamente por el usuario (dependiendo de los que necesita va añadiendo con un botón añadir) con Jquery. Si los campos existen previamente en el HTML entonces si funciona bien.

    Gracias.

  3. Vanesa dice:

    Hola Jose,
    tengo el mismo problema que el compañero.
    En la demo hay 3 pero no se cargan de manera dinámica con JQuery.
    Tengo que cada uno se cargue con un id diferente pero al cargar se dinámicamente es como si no se enterara y no salen con select2.

    Se te ocurre como poder solucionarlo.
    Muchas gracias de antemano.

    • Jose Aguilar dice:

      Hola buenos días,

      Creo que tan solo tienes que llamar a la función select2 3 veces. Una por cada selector. Por ejemplo:

      $(«#selector1»).select2();
      $(«#selector2»).select2();
      $(«#selector3»).select2();

      Saludos

  4. Nolberto dice:

    Hola, estoy probando select2 con boostrap 3, en una vista normal todo esta bien, pero en una ventana modal de boostrap no funciona ni la busqueda ni el diseño. Me gustaria t ayuda con select2 y bootstrap modal. gracias

  5. Jose dice:

    Hola José, como puedo añadir multiples elementos select2 dinamicamente, lo he intentado pero solo el primer elemento sale correcto los demás salen sin el select2

    • Jose Aguilar dice:

      Hola, en la demo tenemos 3. Tan solo tienes que identificar cada select con un id distinto y que la llamada al plugin sea con ese id. 3 llamadas al plugin distintas.

  6. guillermo dice:

    una pregunta, existe alguna manera hacer combobox anidados en chosen?

  7. djesus dice:

    Hola que tal… Podrias enseñar como capturar los valores enviados por el select… utilizando select2..?

    • Jose Aguilar dice:

      Hola, en el caso del ejemplo en funcionamiento recibo mediante php el array $_POST típico de los formularios:

      $_POST[‘countries’] es un array donde tengo los paises seleccionados en uno de los selects múltiples.

      Saludos

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.

Ver más sobre