Category / Section
How to filter complete words in suggestion list using SfTextBoxExt control
1 min read
The complete search words can filter in the suggestion list box by setting SuggestionMode of SfTextBoxExt as Custom. The same has been demonstrated in the following code example:
XAML:
<Page x:Class="App3.MainPage" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="using:App3" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:syncfusion="using:Syncfusion.UI.Xaml.Controls.Input" mc:Ignorable="d"> <Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}"> <syncfusion:SfTextBoxExt AutoCompleteMode="Suggest" AutoCompleteSource="{Binding Stocks}" VerticalAlignment="Center" HorizontalAlignment="Center" Width="200" SuggestionMode="Custom" SearchItemPath="Title" x:Name="filter"></syncfusion:SfTextBoxExt> </Grid> </Page>
C#:
namespace App3 { /// <summary> /// An empty page that can be used on its own or navigated to within a Frame. /// </summary> public sealed partial class MainPage : Page { public MainPage() { this.InitializeComponent(); DataContext = new ViewModel(); filter.Filter = CustomFilter; } private bool CustomFilter(object search, object item) { if ((item as Model).Title.ToLower().StartsWith(search.ToString().ToLower())) return true; return false; } /// <summary> /// Invoked when this page is about to be displayed in a Frame. /// </summary> /// <param name="e">Event data that describes how this page was reached. The Parameter /// property is typically used to configure the page.</param> protected override void OnNavigatedTo(NavigationEventArgs e) { } } public class Model { private string title; public string Title { get { return title; } set { title = value; } } } public class ViewModel { private ObservableCollection<Model> stocks; public ObservableCollection<Model> Stocks { get { return stocks; } set { stocks = value; } } public ViewModel() { stocks = new ObservableCollection<Model>(); stocks.Add(new Model() { Title = "F" }); stocks.Add(new Model() { Title = "FB" }); stocks.Add(new Model() { Title = "FCX" }); stocks.Add(new Model() { Title = "FEYE" }); stocks.Add(new Model() { Title = "FIT" }); } } }