Multi.js una casella di selezione intuitiva basata su JavaScript semplice
Seleziona i menu sono primitivi ma funzionano. Lo stesso vale per tutti i tipici input di modulo come caselle di controllo e tasti della radio.
È facile creare le tue forme ma ricostruire gli elementi dell'interfaccia da zero può essere difficile Ecco perchè Multi.js è un plugin così prezioso per sostituendo le caselle di selezione predefinite.
Con Multi.js, tu dare ai visitatori un elenco di elementi tra cui scegliere con una funzione di selezione multipla integrata nel modulo. In questo modo gli utenti possono clicca più oggetti senza fare affidamento sulle caselle di controllo.
Questo script anche supporta una funzione di ricerca, quindi gli utenti possono cercare elementi se l'elenco è particolarmente lungo.
Trovo anche il menu abbastanza intuitivo, quindi non ha bisogno di molte spiegazioni. Fai clic su qualsiasi elemento sul lato sinistro per aggiungerlo alla colonna di destra (o “selezionato” elementi). Quindi, fai clic sugli elementi nella colonna di destra per rimuoverli.
Tutto funziona su JavaScript vaniglia, inclusa la funzione di ricerca, quindi non hai bisogno di alcuna dipendenza. Benché supporta jQuery se il tuo sito utilizza quella libreria.
Tutto ciò di cui hai bisogno è il file Multi.js e il foglio di stile CSS. Avanti, tu semplicemente creare un elemento e indirizzare l'elemento con una funzione JavaScript, così:
var select_element = document.getElementById ('your_element_ID'); multi (select_element);
In questo momento, il plugin non supporta optgroups ma questa funzione è in lavorazione.
In entrambi i casi, la funzionalità predefinita è sorprendente. Funziona esattamente come te lo aspetti supporta anche i layout mobili reattivi.
Per saperne di più, controlla il Repository GitHub quale include anche i file scaricabili. Il Multi.js pagina demo è bello per vedere come questo plugin funziona nel browser. Ma davvero, è solo un modo semplice per riordina i tuoi menu selezionati migliorando l'esperienza utente complessiva del tuo modulo.