diff --git a/frontend/main.ts b/frontend/main.ts index 5321d27..a3a5644 100644 --- a/frontend/main.ts +++ b/frontend/main.ts @@ -19,18 +19,47 @@ document.addEventListener('DOMContentLoaded', function() { }); function selectBoatChange() { - const boatSelect = document.querySelector('#boat_id'); - if(boatSelect) { - boatSelect.addEventListener('change', function() { - const selectedElement = boatSelect as HTMLSelectElement; - const opt = selectedElement.options[selectedElement.selectedIndex]; - const selectedValue = (opt).dataset.amount_seats; - const rowers = Number(selectedValue) - 1; - choiceObjects['newrower'].config.maxItemCount = rowers; - choiceObjects['newrower'].removeActiveItems(rowers); - (rowers === 0 ? choiceObjects['newrower'].disable() : choiceObjects['newrower'].enable()) - }); - } + const boatSelect = document.querySelector('#boat_id'); + const boatChoice = new Choices(boatSelect, { + loadingText: 'Wird geladen...', + noResultsText: 'Keine Ergebnisse gefunden', + noChoicesText: 'Keine Ergebnisse gefunden', + itemSelectText: 'Zum Auswählen klicken', + callbackOnCreateTemplates: function () { + return { + option: ({ label, value, customProperties, active, disabled, }: any) => { + const opt: HTMLOptionElement = Choices.defaults.templates.option.call( + this, + { label, value, customProperties, active, disabled } + ); + + // We get the original