_bindCloseMenuIfClickedOutside loses context on handleInput

[ttodorovski]

When using asyncOptions callback _bindCloseMenuIfClickedOutside loses context.

[brianblocker]

👍

[marksteve]

Getting Uncaught TypeError: Cannot read property '_closeMenuIfClickedOutside' of undefined too 👍

[jowy]

+1

[alexeiberkov]

I got the same error. To prevent it I did:

            try {
              document.addEventListener('click', this._closeMenuIfClickedOutside);
            }catch(err) {}

[ttodorovski]

My fix was this._bindCloseMenuIfClickedOutside.bind(this) in handleInputChange function

handleInputChange: function handleInputChange(event) {
        // assign an internal variable because we need to use
        // the latest value before setState() has completed.
        this._optionsFilterString = event.target.value;

        if (this.props.asyncOptions) {
            this.setState({
                isLoading: true,
                inputValue: event.target.value
            });
            this.loadAsyncOptions(event.target.value, {
                isLoading: false,
                isOpen: true
            }, this._bindCloseMenuIfClickedOutside.bind(this));
        } else {
            var filteredOptions = this.filterOptions(this.state.options);
            this.setState({
                isOpen: true,
                inputValue: event.target.value,
                filteredOptions: filteredOptions,
                focusedOption: _.contains(filteredOptions, this.state.focusedOption) ? this.state.focusedOption : filteredOptions[0]
            }, this._bindCloseMenuIfClickedOutside.bind(this));
        }
    }

I will add this fix in my forked branch.

[JedWatson]

Should be fixed by #157