syncfusion-winforms-autocomplete
Syncfusion WinForms AutoComplete Control
The AutoComplete control provides auto-suggestion functionality for text input fields in Windows Forms applications. It displays a dropdown list of suggestions as users type, enabling faster data entry and improved user experience with intelligent text completion.
When to Use This Skill
Use the AutoComplete control when you need to:
- Add auto-suggestion to text input fields
- Implement type-ahead search functionality
- Create search boxes with intelligent suggestions
- Enable URL or email address autocomplete
- Build forms with frequently repeated input
- Provide filtered suggestions from large datasets
- Implement custom dropdown behaviors with multi-column displays
Installation
NuGet Installation
Install-Package Syncfusion.Tools.Windows
Assembly Reference
Add reference to:
Syncfusion.Tools.Windows.dllSyncfusion.Shared.Base.dll
Quick Start
Basic Setup
using System;
using System.Windows.Forms;
using Syncfusion.Windows.Forms.Tools;
namespace AutoCompleteDemo
{
public partial class Form1 : Form
{
private AutoComplete autoComplete1;
public Form1()
{
InitializeComponent();
// Create AutoComplete control
autoComplete1 = new AutoComplete();
autoComplete1.Location = new System.Drawing.Point(20, 20);
autoComplete1.Size = new System.Drawing.Size(200, 20);
autoComplete1.ParentForm = this;
// Add data source
autoComplete1.DataSource = new string[]
{
"Australia",
"Austria",
"Brazil",
"Canada",
"China"
};
// Add to form
this.Controls.Add(autoComplete1);
}
}
}
Designer Setup
- Drag
AutoCompletecontrol from Toolbox to Form - Set the
ParentFormproperty to current form - Configure
DataSourcethrough Properties window or code - Customize appearance and behavior through Properties
Core Concepts
Data Source
The AutoComplete control can bind to various data sources:
- String arrays
- Generic collections (List, ArrayList)
- DataTable and DataSet
- Custom objects with IList interface
Parent Form
The ParentForm property must be set to enable the control to display the dropdown suggestion list. This associates the AutoComplete with the parent form's container.
Filtering
Built-in filtering automatically matches user input against the data source, displaying relevant suggestions as the user types.
Navigation Guide
π Getting Started
π Read: references/getting-started.md
- Installation and assembly references
- Creating WinForms application
- Adding AutoComplete control via Designer
- Adding AutoComplete control programmatically
- Basic configuration and setup
- Running the application
π Working with Data Sources
π Read: references/datasource.md
- Binding to string collections
- Binding to DataTable and DataSet
- Binding to custom objects
- Multiple data sources
- Setting data source at design time
- Dynamic data source updates
π¨ Customization
π Read: references/customization.md
- Visual styles and themes
- Font and color customization
- Border styles
- Dropdown appearance
- Auto-size configuration
- Column appearance in dropdown
- Highlight matching text
- Custom rendering
π§ Working with AutoComplete
π Read: references/working-with-autocomplete.md
- Auto-complete modes (Suggest, Append, SuggestAppend)
- Character casing
- Loading behavior
- Auto-population
- Default suggestions
- Clearing and resetting values
- Programmatic selection
π Multi-Column Dropdown
π Read: references/multicolumn-dropdown.md
- Enabling multi-column mode
- Column configuration
- Column headers
- Column width and sizing
- Displaying multiple fields
- Custom column formatting
- Images in dropdown items
- Grid-like appearance
β‘ Events
π Read: references/autocomplete-events.md
- AutoCompleteCustomize event
- AutoCompleteValueChanged event
- BeforeCustomization event
- Handling user selections
- Validating input
- Custom event handlers
π― Overview
π Read: references/overview.md
- Feature overview
- Use cases and scenarios
- Component architecture
- Performance considerations
- Best practices
Common Patterns
Pattern 1: Simple String AutoComplete
AutoComplete autoComplete1 = new AutoComplete();
autoComplete1.Location = new System.Drawing.Point(20, 20);
autoComplete1.Size = new System.Drawing.Size(200, 20);
autoComplete1.ParentForm = this;
// Add string data
autoComplete1.DataSource = new string[]
{
"John", "Jane", "Bob", "Alice", "Charlie"
};
this.Controls.Add(autoComplete1);
Pattern 2: DataTable Binding
AutoComplete autoComplete1 = new AutoComplete();
autoComplete1.ParentForm = this;
// Create DataTable
DataTable dt = new DataTable();
dt.Columns.Add("Name", typeof(string));
dt.Columns.Add("Email", typeof(string));
dt.Rows.Add("John Doe", "john@example.com");
dt.Rows.Add("Jane Smith", "jane@example.com");
autoComplete1.DataSource = dt;
autoComplete1.DisplayMember = "Name";
this.Controls.Add(autoComplete1);
Pattern 3: Multi-Column Display
AutoComplete autoComplete1 = new AutoComplete();
autoComplete1.ParentForm = this;
autoComplete1.Style = AutoCompleteStyle.Default;
// Create DataTable with multiple columns
DataTable dt = new DataTable();
dt.Columns.Add("Name", typeof(string));
dt.Columns.Add("Country", typeof(string));
dt.Columns.Add("City", typeof(string));
dt.Rows.Add("John Doe", "USA", "New York");
dt.Rows.Add("Jane Smith", "UK", "London");
dt.Rows.Add("Bob Johnson", "Canada", "Toronto");
autoComplete1.DataSource = dt;
// Configure columns
autoComplete1.Columns.Add(new AutoCompleteDataColumnInfo("Name", 100));
autoComplete1.Columns.Add(new AutoCompleteDataColumnInfo("Country", 80));
autoComplete1.Columns.Add(new AutoCompleteDataColumnInfo("City", 80));
this.Controls.Add(autoComplete1);
Pattern 4: Custom Filtering with Events
AutoComplete autoComplete1 = new AutoComplete();
autoComplete1.ParentForm = this;
autoComplete1.DataSource = GetDataSource();
// Handle custom filtering
autoComplete1.AutoCompleteControl.ItemsListBox.DrawItem +=
new DrawItemEventHandler(ItemsListBox_DrawItem);
void ItemsListBox_DrawItem(object sender, DrawItemEventArgs e)
{
if (e.Index >= 0)
{
// Custom drawing logic
e.DrawBackground();
e.Graphics.DrawString(
autoComplete1.AutoCompleteControl.ItemsListBox.Items[e.Index].ToString(),
e.Font,
Brushes.Black,
e.Bounds);
e.DrawFocusRectangle();
}
}
this.Controls.Add(autoComplete1);
Pattern 5: URL/Email AutoComplete
AutoComplete autoComplete1 = new AutoComplete();
autoComplete1.ParentForm = this;
autoComplete1.Size = new System.Drawing.Size(300, 20);
// Common URLs
autoComplete1.DataSource = new string[]
{
"http://www.syncfusion.com",
"http://www.google.com",
"http://www.microsoft.com",
"http://www.github.com"
};
// Enable append mode for URL completion
autoComplete1.AutoCompleteMode = AutoCompleteMode.SuggestAppend;
this.Controls.Add(autoComplete1);
Key Properties Reference
| Property | Type | Default | Description |
|---|---|---|---|
DataSource |
object | null | Data source for suggestions (array, DataTable, etc.) |
ParentForm |
Form | null | Parent form containing the control (required) |
AutoCompleteMode |
AutoCompleteMode | Suggest | Behavior mode: None, Suggest, Append, SuggestAppend |
DisplayMember |
string | "" | Property name to display from data source |
ValueMember |
string | "" | Property name for internal value |
Columns |
AutoCompleteDataColumnInfoCollection | - | Column configuration for multi-column display |
Style |
AutoCompleteStyle | Default | Visual style of the control |
Text |
string | "" | Current text value |
SelectedValue |
object | null | Currently selected value |
CharacterCasing |
CharacterCasing | Normal | Text casing: Normal, Upper, Lower |
LoadOnDemand |
bool | false | Load suggestions on demand |
AutoCompleteControl |
AutoCompletePopup | - | Access to underlying popup control |
Events
Common events for the AutoComplete control:
- AutoCompleteValueChanged: Triggered when selected value changes
- AutoCompleteCustomize: Before displaying the dropdown list
- BeforeCustomization: Before applying customization
- TextChanged: When text content changes
- SelectedIndexChanged: When selection changes
- GotFocus: When control receives focus
- LostFocus: When control loses focus
Best Practices
-
Always Set ParentForm: The
ParentFormproperty is mandatory for the dropdown to work properly -
Use Appropriate Mode: Choose the right
AutoCompleteMode:Suggest: Show dropdown onlyAppend: Auto-complete text onlySuggestAppend: Both dropdown and text completion
-
Optimize Large Datasets: Use
LoadOnDemandfor large data sources to improve performance -
Multi-Column for Complex Data: Use multi-column display when showing related information
-
Handle Events Properly: Use
AutoCompleteValueChangedto respond to user selections -
Clear Data Appropriately: Call
ResetItems()or setDataSource = nullto clear suggestions -
Consider Character Casing: Set
CharacterCasingbased on data type (e.g., Upper for state codes) -
Theme Consistency: Use matching visual styles across all Syncfusion controls
Visual Styles
The control supports multiple visual themes:
- Default
- Office2016Colorful
- Office2016White
- Office2016Black
- Office2016DarkGray
- Metro
- Office2007
- Office2010
- VS2010
autoComplete1.Style = AutoCompleteStyle.Office2016Colorful;
Framework Support
- .NET Framework 4.5 and above
- .NET 6.0, .NET 7.0, .NET 8.0 (Windows)
- .NET Core 3.1 (Windows)
Additional Resources
Related Controls
- ComboBoxAdv: Advanced combo box with more customization options
- TextBoxExt: Extended text box with additional features
- AutoCompleteControl: Standalone popup control for custom scenarios
- MultiColumnComboBox: Dedicated multi-column dropdown control
Troubleshooting
Issue: Dropdown doesn't appear
- Ensure
ParentFormproperty is set - Check that
DataSourcecontains valid data - Verify control is added to form's Controls collection
Issue: Multi-column not displaying
- Set appropriate
AutoCompleteStyle - Add columns to
Columnscollection - Ensure DataSource has matching column names
Issue: Performance issues with large datasets
- Enable
LoadOnDemandproperty - Reduce the number of columns displayed
- Consider filtering data source before binding
Issue: Styling not applied
- Ensure Syncfusion theme DLLs are referenced
- Apply style after setting DataSource
- Check for conflicting custom drawing code