Select2: hágalo de solo lectura (¡no deshabilitado!) Desde js

Agradeceríamos tu ayuda para difundir nuestras reseñas acerca de las ciencias informáticas.

Solución:

Esta es la solución para la última select2 (Probado con 4.0.7) usando css only

/*Select2 ReadOnly Start*/
    select[readonly].select2-hidden-accessible + .select2-container 
        pointer-events: none;
        touch-action: none;
    

    select[readonly].select2-hidden-accessible + .select2-container .select2-selection 
        background: #eee;
        box-shadow: none;
    

    select[readonly].select2-hidden-accessible + .select2-container .select2-selection__arrow, select[readonly].select2-hidden-accessible + .select2-container .select2-selection__clear 
        display: none;
    

/*Select2 ReadOnly End*/

Ver: http://select2.github.io/select2/

lo hice con:

$("#modelname-fieldname").select2(disabled:readonly);

Dónde:

• modelname-fieldname es un pecado: $form -> field($modelname, "fieldname") -> widget(Select2::classname(), [ ... ]);
• readonly es true, false o un string readonly

Opcionalmente, puede cambiar el cursor al pasar el cursor sobre el select2 campo.

Solución de Select2 – Problema n.º 3387 – Soporte de solo lectura:

select[readonly].select2 + .select2-container 
  pointer-events: none;
  touch-action: none;

  .select2-selection 
    background: #eee;
    box-shadow: none;
  

  .select2-selection__arrow,
  .select2-selection__clear 
    display: none;
  

Editar: para versiones > 4.07 – como los comentaristas a continuación señalaron correctamente:

select[readonly].select2-hidden-accessible + .select2-container 
    pointer-events: none;
    touch-action: none;

    .select2-selection 
        background: #eee;
        box-shadow: none;
    

    .select2-selection__arrow, select[readonly].select2-hidden-accessible + .select2-container .select2-selection__clear 
        display: none;
    

Aquí tienes las comentarios y puntuaciones

---

---

Utiliza Nuestro Buscador