diff --git a/src/autocomplete.js b/src/autocomplete.js index efec9e0..5e1a315 100644 --- a/src/autocomplete.js +++ b/src/autocomplete.js @@ -16,40 +16,43 @@ export default class Autocomplete extends Controller { } static uniqOptionId = 0 + initialize() { + this.onInputChange = debounce(this.onInputChange, this.delayValue) + this.mouseDown = false + this.readyValue = true + } + connect() { this.close() + } - if(!this.inputTarget.hasAttribute("autocomplete")) this.inputTarget.setAttribute("autocomplete", "off") - this.inputTarget.setAttribute("spellcheck", "false") + resultsTargetConnected(target) { + target.addEventListener("mousedown", this.onResultsMouseDown) + target.addEventListener("click", this.onResultsClick) + } - this.mouseDown = false + resultsTargetDisconnected(target) { + target.removeEventListener("mousedown", this.onResultsMouseDown) + target.removeEventListener("click", this.onResultsClick) + } - this.onInputChange = debounce(this.onInputChange, this.delayValue) + inputTargetConnected(target) { + if(!target.hasAttribute("autocomplete")) target.setAttribute("autocomplete", "off") + target.setAttribute("spellcheck", "false") - this.inputTarget.addEventListener("keydown", this.onKeydown) - this.inputTarget.addEventListener("blur", this.onInputBlur) - this.inputTarget.addEventListener("input", this.onInputChange) - this.resultsTarget.addEventListener("mousedown", this.onResultsMouseDown) - this.resultsTarget.addEventListener("click", this.onResultsClick) + target.addEventListener("keydown", this.onKeydown) + target.addEventListener("blur", this.onInputBlur) + target.addEventListener("input", this.onInputChange) - if (this.inputTarget.hasAttribute("autofocus")) { - this.inputTarget.focus() + if (target.hasAttribute("autofocus")) { + target.focus() } - - this.readyValue = true } - disconnect() { - if (this.hasInputTarget) { - this.inputTarget.removeEventListener("keydown", this.onKeydown) - this.inputTarget.removeEventListener("blur", this.onInputBlur) - this.inputTarget.removeEventListener("input", this.onInputChange) - } - - if (this.hasResultsTarget) { - this.resultsTarget.removeEventListener("mousedown", this.onResultsMouseDown) - this.resultsTarget.removeEventListener("click", this.onResultsClick) - } + inputTargetDisconnected(target) { + target.removeEventListener("keydown", this.onKeydown) + target.removeEventListener("blur", this.onInputBlur) + target.removeEventListener("input", this.onInputChange) } sibling(next) {