Syncfusion AI Assistant

How can I help you?

Autofill in React Combo box component

21 Feb 20262 minutes to read

The ComboBox supports autofill functionality through the autofill property. As you type, the ComboBox automatically completes your input by matching typed characters against available options. If no matches are found, the ComboBox does not suggest any item.

The following examples demonstrate how autofill works with the ComboBox.

import { ComboBoxComponent } from '@syncfusion/ej2-react-dropdowns';
import * as React from 'react';
import * as ReactDOM from 'react-dom';
export default class App extends React.Component {
    // define the array of data
    sportsData = ['Badminton', 'Cricket', 'Football', 'Golf', 'Tennis'];
    render() {
        return (
        // specifies the tag for render the ComboBox component
        <ComboBoxComponent id="comboelement" placeholder="Select a game" autofill={true} dataSource={this.sportsData}/>);
    }
}
ReactDOM.render(<App />, document.getElementById('sample'));
import { ComboBoxComponent } from '@syncfusion/ej2-react-dropdowns';
import * as React from 'react';
import * as ReactDOM from 'react-dom';

export default class App extends React.Component<{}, {}> {
  // define the array of data
  private sportsData: string[] = ['Badminton', 'Cricket', 'Football', 'Golf', 'Tennis'];

  public render() {
    return (
        // specifies the tag for render the ComboBox component
      <ComboBoxComponent id="comboelement" placeholder="Select a game" autofill={true} dataSource={this.sportsData} />
    );
  }
}
ReactDOM.render(<App />, document.getElementById('sample'));