Use on a form?

[supagu]

I'm trying to use the typeahead on a form,

I've have the following:

import { Typeahead as RBTypeahead } from 'react-bootstrap-typeahead';

...

<RBTypeahead
  {...this.props}
  inputProps={{
    name: "myForm.value",
    value: "Australia"
  }}
  ref={(component) => this.typeahead = component.getInstance()}
/>

for my form fields I typically use AvField (which is from this library: https://availity.github.io/availity-reactstrap-validation/)

normally I set the model on the form say:

<AvForm model={{ myForm: { value: "Cheese" } }}>
    <AvField name="myForm.value">
</AvForm

the AvField will have its value set to what ever myForm.value is, in the above example it is "Cheese".
But now I've dropped in the Typeahead component and I don't know how to get it to play nicely together.
Ideally I would like to attach the Typeahead to use the AvField so I may get some sort of validation support.

At the worst case, can I get the typeahead to read the value from the model to set the value on itself. Then when the user changes the typeahead have the value submitted with the form?

[ericgio]

Hi @supagu, questions regarding integration with other libraries are more appropriate for a forum like StackOverflow, where your question will remain open and potentially help others facing the same issue. Posting there also helps me keep the issues queue manageable and limited to bugs and feature requests. Thanks.

https://stackoverflow.com/questions/ask?tags=react-bootstrap-typeahead