Class

TelerikComboBox<TItem, TValue>

Declaration

public TelerikComboBox()

Customizes the content displayed before the input text inside the ComboBox, perfect for adding contextual icons or visual cues. Use to add search icons, category indicators, status symbols, or any visual elements that help users understand the input's purpose. Example: Add a magnifying glass icon for search fields, country flags for location selectors, or user avatars for people pickers. The prefix appears inside the input area and automatically adapts to your theme styling and component size. Children: allows arbitrary content including icons, text, images, and interactive elements.

Declaration

[Parameter]
public RenderFragment ComboBoxPrefixTemplate { get; set; }

Property Value

Defines configuration settings for the ComboBox dropdown popup behavior, dimensions, and styling. Use to customize popup width, height, animations, and CSS classes for advanced layout control. Essential for responsive designs where the popup needs different sizing than the input element. Children: ComboBoxPopupSettings component with properties for Width, Height, Class, and animation settings.

Declaration

[Parameter]
public RenderFragment ComboBoxSettings { get; set; }

Property Value

Customizes the content displayed after the input text inside the ComboBox, ideal for action buttons or additional information. Use to add clear buttons, validation icons, action triggers, or supplementary information that relates to the current selection. Example: Add a "clear all" button, validation checkmarks, dropdown arrows, or status indicators. The suffix appears inside the input area and automatically adapts to your theme styling and component size. Children: allows arbitrary content including buttons, icons, badges, and interactive components.

Declaration

[Parameter]
public RenderFragment ComboBoxSuffixTemplate { get; set; }

Property Value

Customizes how each dropdown item appears by providing a template for rendering individual data items. Use to add rich content, formatting, icons, badges, or complex layouts to dropdown options. Example: Display user profiles with avatars and details, product listings with images and prices, or formatted text with highlighting. The template receives the data item as context, allowing access to all properties for conditional rendering and styling. Children: allows arbitrary content for each item including HTML elements, Blazor components, and data binding expressions.

Declaration

[Parameter]
public RenderFragment<TItem> ItemTemplate { get; set; }

Property Value

Fires before the ComboBox dropdown closes, allowing you to cancel the operation or perform cleanup actions. Use for validation, saving state, updating related components, or implementing custom close behavior. Example: Validate selections, save draft changes, update other form fields, or prevent closing during incomplete operations. Set IsCancelled to true in the event handler to keep the dropdown open.

Declaration

[Parameter]
public EventCallback<ComboBoxCloseEventArgs> OnClose { get; set; }

Property Value

Fires for each dropdown item during rendering, allowing dynamic CSS class assignment based on item data or state. Use to conditionally style items, highlight important options, indicate status, or provide visual categorization. Example: Highlight preferred items, mark disabled options, show selection status, or apply category-specific styling. Access the item data through the event arguments to make styling decisions based on item properties or business logic.

Declaration

[Parameter]
public Action<ComboBoxItemRenderEventArgs<TItem>> OnItemRender { get; set; }

Property Value

Fires before the ComboBox dropdown opens, allowing you to cancel the operation or perform setup actions. Use for validation, loading fresh data, preparing the UI, or implementing conditional access to the dropdown. Example: Validate user permissions, refresh item lists, log user interactions, or prevent opening under certain conditions. Set IsCancelled to true in the event handler to prevent the dropdown from opening.

Declaration

[Parameter]
public EventCallback<ComboBoxOpenEventArgs> OnOpen { get; set; }

Property Value

Fires when the ComboBox needs to load data, enabling server-side filtering, paging, and data operations for large datasets. Use this event to implement custom data loading logic, server-side filtering, or integrate with external data sources. Once you handle this event, you must implement all data source operations (filtering, sorting, paging) in your handler. Essential for virtual scrolling with large datasets - combine with ScrollMode set to Virtual. Example: Load data from APIs, databases, or services based on user input and filtering requirements.

Declaration

[Parameter]
public EventCallback<ComboBoxReadEventArgs> OnRead { get; set; }

Property Value

Controls whether a visual separator line appears between the prefix content and the main input area. When true, displays a subtle vertical line that helps distinguish the prefix from the input text for better visual clarity. Set to false for seamless integration when the prefix should blend naturally with the input content. Works in conjunction with ComboBoxPrefixTemplate to provide professional, polished input styling.

Declaration

[Parameter]
public bool ShowPrefixSeparator { get; set; }

Property Value

Controls whether a visual separator line appears between the main input area and the suffix content. When true, displays a subtle vertical line that helps distinguish the suffix from the input text for better visual organization. Set to false for seamless integration when the suffix should blend naturally with the input content. Works in conjunction with ComboBoxSuffixTemplate to provide professional, polished input styling.

Declaration

[Parameter]
public bool ShowSuffixSeparator { get; set; }

Property Value

Declaration

protected override void BuildRenderTree(RenderTreeBuilder __builder)

Parameters

Overrides ComponentBase.BuildRenderTree(RenderTreeBuilder)