jQuery plugin: Popup Checkbox List

Vi è mai capitato di avere, all’interno di un form, una lista interminabile di checkbox per la stessa scelta?
Graficamente l’aspetto della pagina ne risente notevolmente e anche l’utente finale può sentirsi scoraggiato dal compilare un modulo apparentemente molto lungo.
Per risolvere questo problema ho creato un plugin per jQuery che rende possibile mostrare in una finestra modale l’elenco di checkbox interessato, in maniera da compattare la lunghezza del form, nel quale vengono mostrare solo le scelte effettuate.

Popup Checkbox List
Popup Checkbox List

Demo

La demo è consultabile a questa pagina

Download

Il pacchetto completo è scaricabile QUI

Utilizzo

<form action="" method="post">
<input type="checkbox" id="field2-1" name="field2[]" class="checkbox" value="1" /><label for="field2-1">value 1</label>
<input type="checkbox" id="field2-2" name="field2[]" class="checkbox" value="2" /><label for="field2-2">value 2</label>
<input type="checkbox" id="field2-3" name="field2[]" class="checkbox" value="3" /><label for="field2-3">value 3</label>
</form>


<script type="text/javascript">

$(function(){
	$('.checkbox').popchecklist();

	// OR 
	// $('.checkbox').popchecklist({title:'Select options', label: 'Select'});
});

</script>

Requisiti

Questo plugin ha dipende da:

  • jQuery 1.3+
  • ColorBox 1.3.6+

Licenza

Il plugin è rilasciato sotto le due licenze:

Risorse

http://jquery.com/
http://jacklmoore.com/colorbox/

Un pensiero su “jQuery plugin: Popup Checkbox List

  1. Ciao, trovo questo codice molto utile. Ho provato a metterlo sul sito sul quale sto lavorando ma con Jquery versione 1.7.1 non funziona…al click del link il div colorbox rimane con display:none settato. Qualche idea su come risolvere la situazione? Io non riesco a venirne fuori…grazie!

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *