Topic: MDBAutocomplete loose content when Enter key is pressed on MDBSelect

fbischoff free asked 4 years ago


I notice a strange behavior that I want to get rid of. In my page, I have (among other components) one MDBSelect and one MDBAutocomplete. I want to disable the possibility of selecting an item of the MDBSelect with "Enter" on the keyboard. When I do so (pressing the "Enter" key while the MDBSelect is open), it empties the content of the MDBAutocomplete.

Any idea why ?


    <MDBCol md="12">
        <MDBAutocomplete className="text-uppercase" label={uiElements.title} clear value={this.state.title} data={uiElements.titles} getValue={value => this.getTitle(value)} />
    <MDBCol md="12">
            <MDBCol md="4">
                <MDBSelect getTextContent={value => this.getArtistDetailValue(value)}>
                    <MDBSelectInput selected={uiElements.chooseOption} />
                    <MDBSelectOptions search searchLabel="Rechercher">
                        <MDBSelectOption disabled>{uiElements.chooseOption}</MDBSelectOption>
                                { => {
                                    return (
                                        <MDBSelectOption value={typeActeur.value}>{}</MDBSelectOption>

Suresh Varma free answered 3 years ago

I too facing same issue, i.e on enter key, it empties the content of the MDBAutocomplete search result. For example refer the below link and see by clicking enter after trying 1 or 2 letters. Please advise why MDBAutocomplete is behaving like this on Enter key.

Piotr Glejzer staff commented 3 years ago

Are you using jquery or react?

Konrad Stępień staff answered 4 years ago

Hi @fbischoff,

I want to disable the possibility of selecting an item of the MDBSelect with "Enter" on the keyboard.

How do you do that? I mean, how the function works.

And do you did try to use controlled select in your project? It even seems to fit more into your project. Try this code. I try to use your code and I don't have this problem, but I do not have your data and all functions.

I think if you use controlled select the problem should disappear, please check it. If no, you can show me your problem on git or something webpage? Video is also a good idea. But first, try controlled select.

Best, Konrad.

Please insert min. 20 characters.


Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.



Specification of the issue

  • ForumUser: Free
  • Premium support: No
  • Technology: MDB React
  • MDB Version: 4.13.0
  • Device: Desktop
  • Browser: Google Chrome
  • OS: Windows 10
  • Provided sample code: No
  • Provided link: No