Plugin Select o Combox con multiselect para tus desarrollo web.

Introducción

Una mejora progresiva de los elementos <select forma múltiples>. Se ofrece una alternativa más sencilla con las siguientes ventajas:

• Facilitar a los usuarios a entender e interactuar con los elementos de forma periódica <select múltiples>. Los usuarios saben cómo interactuar con él de instrucciones sans.

• No se requiere que el usuario Ctrl-Click o Shift-Click varios elementos. En cambio los usuarios de su formulario puede agregar o quitar elementos de forma individual, sin riesgo de perder los que ya han sido seleccionados.

• Elementos seleccionados son siempre visibles (dentro de los límites de su interfaz), mientras que los elementos no seleccionados siempre están ocultas (dentro de un normal <select>).

• A diferencia de los elementos regulares <select opción múltiples>, los de asmSelect opcionalmente se puede ordenar con un simple arrastrar y soltar (esta parte requiere jQuery UI).

• esconde asmSelect, mantiene y actualiza la <select múltiples> originales para que no se requieren cambios en el código existente.

• Si un usuario no tiene javascript, entonces por supuesto el múltiples> regulares <select elemento de formulario se utiliza en su lugar.

• Si el original de múltiples> <select elemento de formulario es modificado por algunos jQuery o código Javascript, el cambio se verá reflejado en el asmSelect así.

• Pruebe con un ejemplo vivo

• Artículo sobre las ventajas y desventajas de este método y otros

Tenedores de asmSelect

• bsmSelect

Requisitos

• jQuery 1.2.6 o posterior
• Un documento HTML / XHTML que contiene uno o más elementos de formulario <select múltiples>.

Uso

Incluyen jQuery, asmSelect y css en la cabeza de documento:

 <script type="text/javascript" src="jquery.js"> </ script>
 <script type="text/javascript" src="jquery.asmselect.js"> </ script>
 <link rel="stylesheet" type="text/css" href="jquery.asmselect.css" />

El uso de un selector de jQuery en su función de documento preparado:

 $ (Document). Ready (function () {
     $ ("Select [varios]") asmSelect ().;
 }); 

Si lo desea, puede especificar opciones cuando se llama al plugin:

 $ (Document). Ready (function () {
     $ ("Select [varios]"). AsmSelect ({
         ordenable: true,
         animar: verdad,
         addItemTarget: 'top'
     });
 });

Para configurar opcionalmente una etiqueta dentro de la selección, establezca el atributo título:

 <select name="cities" multiple="multiple" title="Please seleccionar un city">
 ...
 </ Select> 

Link con ejemplo:

• Ejemplo 1
• Ejemplo 2
• Ejemplo 3
• Ejemplo 4

Link al home

Alternativa mas atractiva del mismo plugin
Demo Link
Plugin alternativo