diff --git a/src/c3nav/mesh/static/mesh/js/searchable-select.js b/src/c3nav/mesh/static/mesh/js/searchable-select.js new file mode 100644 index 00000000..cf8b136a --- /dev/null +++ b/src/c3nav/mesh/static/mesh/js/searchable-select.js @@ -0,0 +1,38 @@ +(function () { + function filterOption(option, value) { + if (value === '' || option.text.toLowerCase().includes(value)) { + option.style.display = ''; + return true; + } else { + option.style.display = 'none'; + return false; + } + } + + function performSearch(select, value) { + value = value.toLowerCase().trim(); + for (const child of select.children) { + if (child.nodeName === 'OPTGROUP') { + let any_visible = false; + for (const option of child.children) { + if (option.nodeName !== 'OPTION') continue; + any_visible |= filterOption(option, value); + } + if (!any_visible) { + child.style.display = 'none'; + } else { + child.style.display = ''; + } + } else if (child.nodeName === 'OPTION') { + filterOption(child, value); + } + } + } + + function SearchableSelect(select, search) { + search.addEventListener('input', e => performSearch(select, search.value)); + performSearch(select, search.value); + } + + window.SearchableSelect = SearchableSelect; +})(); \ No newline at end of file diff --git a/src/c3nav/mesh/templates/mesh/mesh_message_send.html b/src/c3nav/mesh/templates/mesh/mesh_message_send.html index 1d29af89..8065d98c 100644 --- a/src/c3nav/mesh/templates/mesh/mesh_message_send.html +++ b/src/c3nav/mesh/templates/mesh/mesh_message_send.html @@ -1,4 +1,5 @@ {% extends 'mesh/base.html' %} +{% load static %} {% load i18n %} {% block heading %} @@ -14,11 +15,28 @@ {% endblock %} {% block subcontent %} +