diff --git a/tailbone/templates/grids/complete.mako b/tailbone/templates/grids/complete.mako
index af1a4f4d..0a5c3780 100644
--- a/tailbone/templates/grids/complete.mako
+++ b/tailbone/templates/grids/complete.mako
@@ -581,26 +581,34 @@
location.href = url
},
- addFilterButton(event) {
+ addFilterInit() {
this.addFilterShow = true
+
this.$nextTick(() => {
+ const input = this.$refs.addFilterAutocomplete.$el.querySelector('input')
+ input.addEventListener('keydown', this.addFilterKeydown)
this.$refs.addFilterAutocomplete.focus()
})
},
+ addFilterHide() {
+ const input = this.$refs.addFilterAutocomplete.$el.querySelector('input')
+ input.removeEventListener('keydown', this.addFilterKeydown)
+ this.addFilterTerm = ''
+ this.addFilterShow = false
+ },
+
addFilterKeydown(event) {
// ESC will clear searchbox
if (event.which == 27) {
- this.addFilterTerm = ''
- this.addFilterShow = false
+ this.addFilterHide()
}
},
addFilterSelect(filtr) {
this.addFilter(filtr.key)
- this.addFilterTerm = ''
- this.addFilterShow = false
+ this.addFilterHide()
},
addFilter(filter_key) {
diff --git a/tailbone/templates/grids/filters.mako b/tailbone/templates/grids/filters.mako
index cb6ec9e2..9a80b911 100644
--- a/tailbone/templates/grids/filters.mako
+++ b/tailbone/templates/grids/filters.mako
@@ -22,7 +22,7 @@
+ @click="addFilterInit()">
Add Filter
@@ -38,8 +38,7 @@
icon-pack="fas"
clearable
clear-on-select
- @select="addFilterSelect"
- @keydown.native="addFilterKeydown">
+ @select="addFilterSelect">