Remove dependency on tailwind elements and switch to using tail.select (Smaller lib, that resolves duplication of selects on back/forward)

This commit is contained in:
Peter Stockings
2023-12-08 09:26:38 +11:00
parent 2bdbda3a05
commit 304ddcb30d
10 changed files with 569 additions and 67 deletions

View File

@@ -10,14 +10,18 @@
<div class="mb-3 w-full"><label
class="block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2"
for="grid-city">People</label>
<select class="bg-gray-50 border border-gray-300 hidden" data-te-select-filter="true"
data-te-select-init="" data-te-select-size="lg" hx-get="{{ url_for('dashboard') }}"
<select class="bg-gray-50 border border-gray-300 hidden" hx-get="{{ url_for('dashboard') }}"
hx-include="[name='min_date'],[name='max_date'],[name='exercise_id']" hx-push-url="true"
hx-target="#container" multiple="" name="person_id" _="init js(me)
te.Select.getOrCreateInstance(me).setValue({{ selected_person_ids | list_to_string | safe}})
tail.select(me, {
multiple: true,
search: true,
placeholder: 'Filter people',
})
end">
{% for p in people %}
<option value="{{ p['PersonId'] }}">{{
<option value="{{ p['PersonId'] }}" {% if p['PersonId'] in selected_person_ids %}selected{%
endif %}>{{
p['Name']
}}</option>
{% endfor %}
@@ -32,14 +36,18 @@
<div class="mb-3 w-full"><label
class="block uppercase tracking-wide text-gray-700 text-xs font-bold mb-2"
for="grid-city">Exercises</label>
<select class="bg-gray-50 border border-gray-300 hidden" data-te-select-filter="true"
data-te-select-init="" data-te-select-size="lg" hx-get="{{ url_for('dashboard') }}"
<select class="bg-gray-50 border border-gray-300 hidden" hx-get="{{ url_for('dashboard') }}"
hx-include="[name='min_date'],[name='max_date'],[name='person_id']" hx-push-url="true"
hx-target="#container" multiple="" name="exercise_id" _="init js(me)
te.Select.getOrCreateInstance(me).setValue({{ selected_exercise_ids | list_to_string | safe}})
tail.select(me, {
multiple: true,
search: true,
placeholder: 'Filter exercises',
})
end">
{% for e in exercises %}
<option value="{{ e['ExerciseId'] }}">{{
<option value="{{ e['ExerciseId'] }}" {% if e['ExerciseId'] in selected_exercise_ids
%}selected{% endif %}>{{
e['Name']
}}</option>
{% endfor %}