[SOLUCIONADO] Poner checkbox dentro de un select

[darkdraco_26]

¡Ayuda!

Alguien sabe como poner varios checkbox dentro de un select?

me urge, gracias

[Alexis88]

No se puede, sin embargo, puedes elegir más de una opción de un elemento <select> añadiéndole el atributo multiple.

Código HTML:

<select multiple>
    <option value = 1>Uno</option>
    <option value = 2>Dos</option>
    <option value = 3>Tres</option>
    <option value = 4>Cuatro</option>
    <option value = 5>Cinco</option>
</select>
 

Solamente tienes que pulsar la tecla Ctrl para seguir seleccionando más opciones.

DEMO

Saludos

[darkdraco_26]

Gracias por tu ayuda, pero es es lo que yo tengo pero lo que quiero es que el usuario no presione la tecla control no se si se pueda de otro modo.

[Alexis88]

Entonces, coloca una lista de checkbox, uno debajo de otro, pero no puedes insertarlos a un <select>. Lo más parecido sería que elabores una lista desplegable, como la de los menús desplegables y en esa lista añades a los checkbox, pero ese ya es un tema de CSS.

Saludos

[darkdraco_26]

Muy buena idea, lo voy a intentar, se un poco de css y ya e hecho cosas asi pero no lo pense antes

[darkdraco_26]

No me funciono no se si tengan otra idea

[andresgarciadev]

tal vez podrias hacer primero esto
http://jsfiddle.net/PB56Z/
de tal forma no tendria q usar el control... despues basta con recorrer todos los option con la clase "blue" en ese caso.... y mandarlos....
podria ser guardandolos en un input separado por comas o no se como quieras hacerlo xD .... pero bueno... no se si te sirva hacerlo de esta manera

[Alexis88]

Se me ocurre otra solución. Cada vez que seleccionas una opción del <select>, cambias el valor de éste, es decir, si seleccionaste la opción de valor 4, el valor del <select> será 4 y así con el resto de opciones, entonces, cada vez que selecciones un valor, insértalo en un array, pero si nuevamente lo seleccionas, búscalo en dicho array y de encontrarse, lo eliminas. Para que el usuario sepa qué valores ha seleccionado, muestras el array en un elemento del DOM.

Código Javascript:

var opciones = [];
 
$("#multiple").click(function(){
    var valor = this.value,
        posicion = opciones.indexOf(valor);
    if (posicion >= 0)
        opciones.splice(posicion, 1);
    else
        opciones.push(valor);
    
    $("p").html(opciones); //Muestras el array en un elemento <p> o en donde desees
});
 

DEMO

Si luego deseas enviar la lista de valores seleccionados para procesarlos, solamente necesitas enviar el contenido del array.

Saludos

[darkdraco_26]

Las 2 respuestas son excelectes aun que me funciono mas la de andresgarciadev ya que se me facilita mas css y a los arreglos no le entiendo muy bien aun pero muchas gracias a los 2.

[Alexis88]

Una cosa más. Nunca vuelvas a decir algo como esto:

Iniciado por darkdraco_26

No me funciono no se si tengan otra idea

Recuerda que el que no persevera, no triunfa, debes intentarlo una y otra vez, investigando por tu cuenta acerca de las mejores formas que puedes seguir para conseguir tu objetivo, además, aquí estamos para orientarte, no para pensar en las soluciones que necesitas ni darte los trabajos hechos. La opción de la lista desplegable con los checkbox era bastante fácil de elaborar, si al menos hubieras mostrado lo que hiciste para saber en dónde estabas fallando, te hubiéramos podido ayudar.

No olvides marcar el tema como solucionado cuando ya tengas la respuesta a tu inquietud.

Saludos