Chosen: Convertir una entrada elegida en un campo obligatorio

Creado en 14 feb. 2012  ·  6Comentarios  ·  Fuente: harvesthq/chosen

Mi marcado original establece que la selección sea un campo required , sin embargo, Chosen no parece cumplir con eso.

Comentario más útil

Si está utilizando Chosen para todos los elementos select , puede usar este CSS para cambiarlo y hacerlo visible (a DOM), pero sin opacidad, sin altura, posición absoluta.

Estos selectores de CSS apuntan a elementos de selección no válidos, y uno de ellos apunta a multiple agrega 15px margin-top para centrarlo en los elementos de selección múltiple.

select:invalid {
    height: 0px !important;
    opacity: 0 !important;
    position: absolute !important;
    display: flex !important;
}

select:invalid[multiple] {
    margin-top: 15px !important;
}

Demostración: http://jsfiddle.net/tripflex/2zdeu9oc/

Todos 6 comentarios

@jbrooksuk , ¿alguna vez encontró una solución para esto? jQuery Validate tampoco parece permitirme forzar que el campo sea obligatorio.

Tengo un parche para esto al que se hace referencia en el n.º 515 y una solicitud de extracción en el n.º 900.

Terminé escribiendo una función de ayuda que realiza esta verificación manualmente en los elementos elegidos. Lo desenterraré mañana si puedo encontrarlo, aunque mientras tanto, la solución de @CaptainN se ve bien: +1:

Este es un engaño de https://github.com/harvesthq/chosen/issues/515. Estaremos siguiendo hasta allí. Gracias.

515 es técnicamente un engaño de esto, pero sí, está bien.

Si está utilizando Chosen para todos los elementos select , puede usar este CSS para cambiarlo y hacerlo visible (a DOM), pero sin opacidad, sin altura, posición absoluta.

Estos selectores de CSS apuntan a elementos de selección no válidos, y uno de ellos apunta a multiple agrega 15px margin-top para centrarlo en los elementos de selección múltiple.

select:invalid {
    height: 0px !important;
    opacity: 0 !important;
    position: absolute !important;
    display: flex !important;
}

select:invalid[multiple] {
    margin-top: 15px !important;
}

Demostración: http://jsfiddle.net/tripflex/2zdeu9oc/

¿Fue útil esta página
0 / 5 - 0 calificaciones