diff --git a/assets/controllers/elements/part_search_controller.js b/assets/controllers/elements/part_search_controller.js
index 4a70c6d2..c33cece0 100644
--- a/assets/controllers/elements/part_search_controller.js
+++ b/assets/controllers/elements/part_search_controller.js
@@ -186,5 +186,15 @@ export default class extends Controller {
                 ];
             },
         });
+
+        //Try to find the input field and register a defocus handler. This is necessarry, as by default the autocomplete
+        //lib has problems when multiple inputs are present on the page. (see https://github.com/algolia/autocomplete/issues/1216)
+        const inputs = this.element.getElementsByClassName('aa-Input');
+        for (const input of inputs) {
+            input.addEventListener('blur', () => {
+                this._autocomplete.setIsOpen(false);
+            });
+        }
+
     }
 }
\ No newline at end of file
diff --git a/templates/components/search.macro.html.twig b/templates/components/search.macro.html.twig
index 9e9185bf..e62af2b1 100644
--- a/templates/components/search.macro.html.twig
+++ b/templates/components/search.macro.html.twig
@@ -1,7 +1,7 @@
 {% macro settings_drodown(show_label_instead_icon = true) %}
 
     <div class="dropdown">
-        <button class="btn dropdown-toggle my-2" type="button" id="navbar-search-options" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false" data-bs-auto-close="false">
+        <button class="btn dropdown-toggle my-2" type="button" id="navbar-search-options" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false" data-bs-auto-close="true">
             {% if show_label_instead_icon %}{% trans %}search.options.label{% endtrans %}{% else %}<i class="fa-solid fa-gear"></i>{% endif %}
             <span class="caret"></span>
         </button>