Bloguero-ec

Codigo Fuente, programación, Diseño Web

Multiple Select : Seleccionar checkbox con jQuery

agosto 10, 2015
codigo-fuente,javascript,jquery



Múltiple select ,es  un plugin muy sencillo y liviano que nos permitirá seleccionar checkbox con jquery  y se encargará de reemplazar nuestro select múltiple en un divisor con una lista desordenada (UL) con todas las opciones en fila y cada una con su correspondiente checkbox al lado. Además, como bonus, nos agregará una opción para marcar y desmarcar todas las opciones a la vez.

Este plugin contiene muchísimas opciones de configuración, como agrupar elementos dentro de sus optgroups , agregar campos de textos para filtrar resultado , aplicar estilos específicos entre otras opciones que te invito a visitar.

Su configuración es muy sencilla y es compatible con IE , Mozilla , Chrome  y otros navegadores, con lo que no debería haber problemas para usarlo en cualquier proyecto.

IMPORTANTE: No olvides llamar a tu select con un nombre-array (ejemplo: miselect[]) con llaves (corchetes) si quieres que se puedan procesar todas las opciones seleccionadas, de lo contrario, sólo se enviará la última opción marcada.

<head>
    <link href="multiple-select.css" rel="stylesheet"/>
</head>
<body>
    <select multiple="multiple">
        <optgroup label="Group 1">
            <option value="1">Option 1</option>
            ...
        </optgroup>
        ...
        <optgroup label="Group 3">
            ...
            <option value="9">Option 9</option>
        </optgroup>
    </select>
    <script src="jquery.multiple.select.js"></script>
    <script>
        $('select').multipleSelect();
    </script>
</body>

Su descarga se encuentra disponible en github es muy buena opción a la hora de seleccionar varios checkbox ..

Mas Publicaciones

Siguenos




Conviertase en Editor

Te gustaría ser editor en Bloguero-ec.? Escribe tutoriales referente a programación, diseño web, CSS, entre otros y deja tu marca personal en nuestro sitio, contáctanos y empieza a editar Ya..

Compartir..!

© Copyright 2017 Bloguero-ec - Derechos Reservados

A %d blogueros les gusta esto: