Autocomplete

Overview

The AutoComplete component provides real-time suggestions of related items based on user input. It helps users quickly complete their input and is useful in places where search functionality is needed.

Key Features

1. Custom Renderer

You can render each item in the suggestion list in any desired form. Items can be expressed by freely combining text, images, buttons, etc.

View Related Items

• Properties

  suggestSource, label, labelField, minChar

---

2. Suggestion List State Handling

Improves user experience by visually displaying the state of the suggestion list during loading or when there is no data.

View Related Items

• Properties

  placeholder, suggestSource, labelField, minChar

---

3. Suggestion List Configuration

You can customize the logic for constructing suggestion lists related to the input text to apply various suggestion criteria (e.g., API calls, local data filtering, etc.).

View Related Items

• Properties

  label, suggestSource,labelField

---

4. Label and Placeholder

Set label and placeholder in the input field to clearly guide users about the input purpose and format.

View Related Items

• Properties

  label, placeholder, suggestSource, minChar

---

5. Minimum Character Specification

You can set how many characters need to be entered before suggestions start appearing, to prevent unnecessary suggestions when users enter very short words.

View Related Items

• Properties

  suggestSource, labelField, minChar

Minimum characters

2

Please enter at least 2 characters.

---

6. Suggestion List Container Control

Provides automatic and manual closing functionality for the suggestion list container, allowing users to conveniently manage suggestion lists.

View Related Items

• Properties

  label, suggestSource, labelField, clearable

Close the suggest when an item is selected.

Close the suggest when it loses focus.

Close the suggest when clicking outside.