component prevents from triggering host form#onSubmit

Version

react-bootstrap-typeahead@3.2.4

Steps to reproduce

<form onSubmit="() => console.log('on-submit')">
  <Typeahead
          labelKey="name"
          multiple={multiple}
          options={options}
          placeholder="Choose a state..."
        />
</form>

Expected Behavior

should trigger onSubmit handler.

Actual Behavior

does nothing

I have fixed this problem before https://github.com/ericgio/react-bootstrap-typeahead/issues/112 but it seem this bug returned again

[ericgio]

@hyzhak: I know it’s not ideal, but I think the workaround above should address your use case. Assuming that’s true, I’m going to close this issue as resolved. Let me know if I’m missing something, however.

[ericgio]

The behavior you were seeing before was unintended, if not an outright bug, so what you’re asking for is really a new feature that allows users to make arbitrary selections when hitting enter. It’s unlikely I’ll add that as a first-class piece of the API, but it should currently be possible to achieve what you’re after. For example, you could use the typeahead’s onKeyDown listener to submit the form when the user hits enter:

<form ref={form => this._form = form}>
  <Typeahead
    ...
    onKeyDown={(e) => {
      if (e.keyCode === 13) {
        this._form.submit();
      }
    }}
  />
  <button type="submit">
    Submit
  </button>
</form>