1. Select2

Ein jQuery-basiertes Ersatz für Auswahlkästchen, das Suchen, Tagging, entfernte Datensätze, unendliches Scrollen und viele andere häufig verwendete Optionen unterstützt.

Framework-Unterstützung:

  • React: Indirekte Unterstützung durch Wrapper wie react-select2-wrapper.
  • Angular: Integration möglich über Direktiven oder Drittanbieter-Wrapper.
  • Vue.js: Wrapper wie vue-select2 sind verfügbar.

Github Sterne: 26.000+

NPM wöchentliche Downloads: ~597.343

Bundle-Größe: Ungefähr 27 KB (minified)

Erste Veröffentlichung: März 2012

Neueste Veröffentlichung: 28. Januar 2020 (v4.0.13)

Website: https://select2.org

Github: https://github.com/select2/select2

Live-Demo:

Ein durchsuchbarer, gruppierter Zeitzonenauswähler mit Select2

2. Choices.js

Choices.js ist eine leichte, abhängigkeitfreie JavaScript-Bibliothek zur Erstellung anpassbarer Multi-Select-Dropdowns, Tag-Eingaben und Autocomplete-Felder. Sie bietet große Flexibilität, modernes Styling und Barrierefreiheit, was sie perfekt macht, um Formulare zu verbessern, ohne auf jQuery angewiesen zu sein.

Framework-Unterstützung:

  • React: Kann mit benutzerdefinierten Wrappern integriert werden.
  • Angular: Integration möglich über Direktiven.
  • Vue.js: Kann mit benutzerdefinierten Komponenten integriert werden.

GitHub Sterne: 6.400+

NPM wöchentliche Downloads: ~179.897

Bundle-Größe: Ungefähr 78 KB (minified)

Erste Veröffentlichung: Oktober 2016

Neueste Veröffentlichung: Februar 2025 (v11.0.6)

Website: https://choices-js.github.io/Choices

Github: https://github.com/Choices-js/Choices

Live-Demo:

Ein durchsuchbarer, gruppierter Zeitzonenauswähler mit Choices.js

3. Tom Select

Tom Select ist eine leichte, funktionsreiche JavaScript-Bibliothek zur Erstellung anpassbarer Auswahlkästchen, Autocomplete-Eingaben und Tag-Eingaben. Sie unterstützt das Laden von Daten aus der Ferne, Tastaturnavigation und Mehrfachauswahl, was sie zu einer großartigen Alternative zu Select2 mit einem modernen, abhängigkeitfreien Design macht.

Framework-Unterstützung:

  • React: Offizieller React-Wrapper verfügbar.
  • Angular: Integration möglich über benutzerdefinierte Direktiven.
  • Vue.js: Offizieller Vue-Wrapper verfügbar.

GitHub Sterne: 1.800+

NPM wöchentliche Downloads: ~91.842

Bundle-Größe: Ungefähr 53 KB (minified)

Erste Veröffentlichung: November 2020

Neueste Veröffentlichung: Februar 2025 (v2.4.3)

Website: https://tom-select.js.org/

Github: https://github.com/orchidjs/tom-select

Live-Demo:

Ein durchsuchbarer, gruppierter Zeitzonenauswähler mit Tom Select

4. React Select

React-Select ist eine schöne, flexible und hochgradig anpassbare Dropdown-Bibliothek für React. Sie unterstützt durchsuchbare, asynchrone, Mehrfachauswahl- und gruppierte Optionen, was sie perfekt für die Verarbeitung großer Datensätze macht. Mit eingebauter Barrierefreiheit und Themen ist sie eine beliebte Wahl für moderne React-Anwendungen.

Framework-Unterstützung:

  • React: Speziell für React-Anwendungen entwickelt.

GitHub Sterne: 27.900+

NPM wöchentliche Downloads: ~4.328.556

Erste Veröffentlichung: November 2020

Neueste Veröffentlichung: Juli 2018 (react-select@5.10.1)

Website: https://react-select.com

Github: https://github.com/JedWatson/react-select

Live-Demo:

Ein durchsuchbarer, gruppierter Zeitzonenauswähler mit React Select

5. Downshift

Downshift ist eine leichte, headless Dropdown- und Autocomplete-Bibliothek für React. Sie bietet flexible, zugängliche und anpassbare Komponenten zum Erstellen von Auswahlkästchen, Autocomplete-Eingaben und Kombinationsfeldern, ohne irgendwelche Stile aufzuzwingen. Perfekt für Entwickler, die die volle Kontrolle über die Benutzeroberfläche haben möchten und gleichzeitig die WAI-ARIA-Barrierefreiheit sicherstellen.

Framework-Unterstützung:

  • React: Speziell für React-Anwendungen entwickelt.

GitHub Sterne: 12.200+

NPM wöchentliche Downloads: ~1.335.528

Erste Veröffentlichung: August 2017

Neueste Veröffentlichung: August 2024 (v9.0.8)

Website: https://www.downshift-js.com

Github: https://github.com/downshift-js/downshift

Live-Demo: