Seit das country select mit TomSelect gerendert wird, werden im Dropdown nicht mehr alle Länder angezeigt. Das liegt daran, dass TomSelect per default nur die ersten 50 Optionen auflistet. Mit typing wird die Liste gefiltert, so stehen trotzdem alle Optionen zur Auswahl.
Dies stiftet Verwirrung bei Personen welche sich nicht gewohnt sind in einem Dropdown mit typing zu suchen. TomSelect soll so konfiguriert werden, dass ohne typing alle Optionen im Dropdown angezeigt werden.
Tech-Spec
TomSelect listet per default nur die ersten 50 Optionen auf. Dies kann mit der Option maxOptions konfiguriert werden. Diese Option ist in der TomSelect-Dokumentation beschrieben: TomSelect Usage Documentation. Wenn maxOptions auf null gesetzt wird, werden alle Optionen angezeigt.
Auf den Country Select wird TomSelect bisher per class attribute 'tom-select' und den event listener definiert in app/javascript/javascripts/modules/tom_select.js initializiert.
Für denselben Zweck gibt es aber auch den Stimulus Controller TomSelectController in app/javascript/controllers/tom_select_controller.js. Dieser soll um die Option maxOptions erweitert werden, welche als Stimulus Value data attribute auf dem Select Element konfiguriert werden kann. Als default value soll null gesetzt werden, damit grundsätzlich alle Optionen angezeigt werden.
ToDo
Seit das country select mit TomSelect gerendert wird, werden im Dropdown nicht mehr alle Länder angezeigt. Das liegt daran, dass TomSelect per default nur die ersten 50 Optionen auflistet. Mit typing wird die Liste gefiltert, so stehen trotzdem alle Optionen zur Auswahl.
Dies stiftet Verwirrung bei Personen welche sich nicht gewohnt sind in einem Dropdown mit typing zu suchen. TomSelect soll so konfiguriert werden, dass ohne typing alle Optionen im Dropdown angezeigt werden.
Tech-Spec
TomSelect listet per default nur die ersten 50 Optionen auf. Dies kann mit der Option
maxOptionskonfiguriert werden. Diese Option ist in der TomSelect-Dokumentation beschrieben: TomSelect Usage Documentation. WennmaxOptionsaufnullgesetzt wird, werden alle Optionen angezeigt.Auf den Country Select wird TomSelect bisher per class attribute
'tom-select'und den event listener definiert inapp/javascript/javascripts/modules/tom_select.jsinitializiert.Für denselben Zweck gibt es aber auch den Stimulus Controller
TomSelectControllerinapp/javascript/controllers/tom_select_controller.js. Dieser soll um die OptionmaxOptionserweitert werden, welche als Stimulus Value data attribute auf dem Select Element konfiguriert werden kann. Als default value sollnullgesetzt werden, damit grundsätzlich alle Optionen angezeigt werden.ToDo
app/javascript/controllers/tom_select_controller.jsanpassen:maxOptionsValue hinzufügen mit defaultnull#getOptionserweitern ummaxOptions: this.maxOptionsValuecountry_select()-Aufrufe in den Views anpassen so dass der Stimulus Controller verwendet wirdapp/views/contactable/_address_fields.html.hamlapp/views/event/participation_contact_datas/_address_fields.html.hamldata-tom-select-max-options-valueauf dem select Element korrekt konfiguriert wird.