Dropdown-selecties in HTML zijn enkele van de meest native niet-gebruiksvriendelijke items. Het stylen ervan is lastig en bij hun basisfunctionaliteit zijn ze niet erg handig, tenzij je een beperkt aantal items hebt met een beperkt aantal behoeften.
Dat is waar Chosen binnenkomt. Het is een javascript-bibliotheek die de dropdown-ervaring er veel mooier maakt, maar ook vanuit een functionaliteitsperspectief veel leuker.
Hierboven ziet u de standaard gekozen functionaliteit. Het ziet er geweldig uit en heeft standaard een eenvoudig zoekmechanisme om door resultaten te filteren voor het geval u een groot aantal items in uw vervolgkeuzelijst heeft. Neem eerst de javascript- en css-bestanden op. Initialiseer ze vervolgens met de onderstaande code.
Zo eenvoudig is het. Laten we nu naar het volgende niveau gaan, wat als u de functionaliteit van de vervolgkeuzelijst wilde kunnen wijzigen om meerdere selecties mogelijk te maken? Zoek hieronder naar "Rood", druk vervolgens op Enter, zoek naar "Blauw" en druk vervolgens op Enter. Nu kunt u ze net zo gemakkelijk uit uw selectie verwijderen door twee keer op de X of backspace te drukken.
Het enige wat u hoeft te doen is de optie multiple doorgeven in de aanroep van de select, zoals hieronder. Er is geen wijziging in het JavaScript, het wordt op exact dezelfde manier geïnitialiseerd.
