Creatable doesn't get new value from onInputChange() prop

[cscholze]

The onInputChange() handler does not return the modified value. I've included a plunker to demonstrate the issue.

The issue is that this.props.onInputChange does not mutate input, thus this.inputValue is always input and the method always returns the unmodified input.
https://github.com/JedWatson/react-select/blob/master/src/Creatable.js#L172

onInputChange (input) {
	const { onInputChange } = this.props;

	if (onInputChange) {
		onInputChange(input);
	}

	// This value may be needed in between Select mounts (when this.select is null)
	this.inputValue = input;
},

It appears that there a couple of related issues and PRs already open, but either they have not been reviewed or the submitter has not updated. I also don't think that the open PRs offer the best solution, nor solve it completely, so I felt it best to open a new issue and PR. Either way, we are trying to use this library in a project and would like to see this corrected as soon as possible.

Opened PR #2057

Related open Issues
#1597
#1506
#1349

Related open PRs
#1363
#1411

@JedWatson

[noveogroup-amorgunov]

I await fix for this issues too

[petrdanecek]

I think I'm facing this issue in my project. I'm using 1.0.0-rc.10 and implemented very simple Creatable code below. I'm getting the console output converted to lowercase as I type in the browser so the function onInputChange is called properly. The chars are not changed to lower case in the react select component.

Is the fix available in the rc.10? Should I use onInputChange some other way?

My code

class Command extends React.Component {
constructor(props) {
    super(props);
    this.onChange = this.onChange.bind(this);
    this.onInputChange = this.onInputChange.bind(this);
  ...
  }

onInputChange(value) {
    console.log(value.toLowerCase())
    return value.toLowerCase();
  }
...

  render() {
 ...
    return (
      <div>
        <Creatable
          value={this.props.value}
          onChange={this.onChange}
          onInputChange={this.onInputChange}
          options={this.props.availableCommands}
          multi
          name="commands"
        />
      </div>
    );
  }
}

Answering myself:
the fix is not in v1.0.1 yet.

Seems to be working fine on 1.1.0.
Thanks all!

[bladey]

Hello -

In an effort to sustain the react-select project going forward, we're closing old issues / pull requests.

We understand this might be inconvenient but in the best interest of supporting the broader community we have to direct our limited efforts to maintain the latest version.

If you feel this issue / pull request is still relevant and you'd like us to review it, please leave a comment and we'll do our best to get back to you.

[ddaGarrido]

hi, so react-select creatable component does not have the onInputChange anymore? i'm having a bad time trying to use this logic. Does exist any other alternative to that?