Edit this page

Key Properties

The purpose of this help article is to show you the key properties of RadAutoCompleteBox control. The topic includes the following properties:

Setting the ItemsSource

The ItemsSource property of RadAutoCompleteBox could be set to any collection of items. However, it is recommended to set it to an ObservableCollection. Read more.

Changing the TextSearchMode

The TextSearchMode property represents the behavior by which items in the ItemsSource will be filtered. This property can be set to four values - Contains, ContainsCaseSensitive, StartsWith, StartsWithCaseSensitive. By default the TextSearchMode property is set to StartsWith.

Changing the SelectionMode

The SelectionMode property represents the behavior by which items will be selected in RadAutoCompleteBox control. This property can be set to two values - Single, Multiple. By default the SelectionMode property is set to Multiple.

Setting the Style and Template properties

It is possible to customize the way items in the DropDown portion of the control, the TextBox and the selected Items appear by customizing the DropDownItemTemplate, TextBoxStyle and BoxesItemTemplate.

Setting NoResultsContent, NoResultsContentTemplate properties

With the NoResultsContent and NoResultsContentTemplate properties of RadAutoCompleteBox you could easily add a text or any other content to appear in the drop down whenever the control cannot find any matching items.

NoResultsContent and NoResultsContentTemplate properties are available with Telerik UI for WPF version R3 2016 or later.

The following snippet demonstrates how to set NoResultsContent to simple text:

Using NoResultsContent

<telerik:RadAutoCompleteBox ItemsSource="{Binding Countries}" NoResultsContent="No Matches" /> 

And this would be the result:

For more complex representation you could use NoResultsContentTemplate in order to apply a DataTemplate containing the desired layout. The following example shows how to display an icon in front of the text:

Using NoResultsContentTemplate

<telerik:RadAutoCompleteBox ItemsSource="{Binding Countries}" NoResultsContent="No Matches">
    <telerik:RadAutoCompleteBox.NoResultsContentTemplate>
        <DataTemplate>
            <StackPanel Orientation="Horizontal">
                <Grid  Width="16" Height="16" VerticalAlignment="Center" HorizontalAlignment="Left">
                    <Ellipse Stroke="Red" StrokeThickness="1" />
                    <Path Data="M0,8 L2,8 2,10 0,10 z M0,0 L2,0 2,7 0,7 z" Fill="Red" Stretch="Fill" Margin="7 3" />
                </Grid>
                <TextBlock Text="{Binding}" Margin="3 0" />
            </StackPanel>
        </DataTemplate>
    </telerik:RadAutoCompleteBox.NoResultsContentTemplate>
</telerik:RadAutoCompleteBox> 

The result would be the following:

Setting WatermarkContent

The WatermarkContent property specifies the text or any other content to be displayed when RadAutoCompleteBox's TextBox is not focused. When in Single SelectionMode no item should be selected for the watermark content to be visible.

Figure 1: Custom Watermark Content

Custom Watermark Content

Other properties

There are some other key properties in RadAutoCompleteBox:

  • MaxDropDownHeight - Gets or sets the maximum height of the dropdown portion of the AutoCompleteBox control.

  • TextSearchPath - Gets or sets the property path that is used to get the autocomplete text to filter items.

  • SelectedItem - Gets or sets the currently selected item into RadAutoCompleteBox.

  • SelectedItems - Gets or sets a collection containing the currently selected items into RadAutoCompleteBox.

See Also

Was this article helpful? Yes No

Give article feedback

Tell us how we can improve this article

Dummy