Multi.js - Een gebruikersvriendelijke selectie box gebouwd op gewoon JavaScript
Selecteer menu's zijn primitief maar ze werken. Hetzelfde geldt voor alle typische vorminputs zoals checkboxes en Radio knoppen.
Het is eenvoudig om uw eigen formulieren te maken, maar het opnieuw opbouwen van interface-elementen kan moeilijk zijn. Daarom Multi.js is zo'n waardevolle plug-in voor het vervangen van standaard selectievakjes.
Met Multi.js, jij geef bezoekers een lijst met items om uit te kiezen met een multi-select-functie ingebouwd in het formulier. Op deze manier kunnen gebruikers klik op meerdere items zonder te vertrouwen op selectievakjes.
Dit script zelfs ondersteunt een zoekfunctie, zodat gebruikers naar items kunnen zoeken als de lijst bijzonder lang is.
Ik vind het menu ook behoorlijk intuïtief, dus het heeft niet veel uitleg nodig. U klikt op een item aan de linkerkant om het toe te voegen aan de rechterkolom (of “gekozen” items). Klik vervolgens op items in de rechterkolom om ze te verwijderen.
Alles draait op vanilla JavaScript, inclusief de zoekfunctie, dus je hebt geen afhankelijkheden nodig. Hoewel het ondersteunt jQuery als uw site die bibliotheek gebruikt.
Het enige dat u nodig hebt, is het Multi.js-bestand en de CSS-stylesheet. Vervolgens, gewoon Maak een element en target het element met een JavaScript-functie, zoals zo:
var select_element = document.getElementById ('uw_element_ID'); multi (select_element);
Op dit moment is de plug-in ondersteunt optgroups niet maar deze functie is in de maak.
Hoe dan ook, de standaardfunctionaliteit is verbluffend. Het werkt precies zoals je zou verwachten en het ondersteunt zelfs op mobiele responsieve lay-outs.
Voor meer informatie, bekijk de GitHub repo welke bevat ook downloadbare bestanden. De Multi.js demopagina is geweldig om te zien hoe deze plug-in werkt in de browser. Maar echt, het is gewoon een eenvoudige manier om restyle uw geselecteerde menu's terwijl u de algehele gebruikerservaring van uw formulier verbetert.