Retrieving Selected Values in WPF Autocomplete (SfTextBoxExt)

SelectedValue

The SelectedValue property is used to retrieve the selected values from the suggestion list.

The following code snippet demonstrates how to set SelectedValue.

<Window x:Class="Demo_Sample.SelectedValue"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:editors="clr-namespace:Syncfusion.Windows.Controls.Input;assembly=Syncfusion.SfInput.Wpf"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:Demo_Sample"
        mc:Ignorable="d"
        Title="SelectedValue" Height="450" Width="800">
    <StackPanel VerticalAlignment="Center">
        <StackPanel VerticalAlignment="Center" Margin="20">
            <StackPanel VerticalAlignment="Center" Margin="0,20,0,20" HorizontalAlignment="Left">
                <TextBlock Text="SelectedValue:"/>
            </StackPanel>
            <editors:SfTextBoxExt HorizontalAlignment="Left"                                
                                  x:Name="autoComplete"
                                  MaxDropDownHeight="100"
                                  MultiSelectMode="None"  
                                  AutoCompleteMode="Suggest"                                                                                       
                                  SearchItemPath="Name"
                                  ValueMemberPath="Email"
                                  AutoCompleteSource="{Binding Employees}"
                                  VerticalAlignment="Center"                                
                                  SelectedItemChanged="AutoComplete_SelectedItemChanged"
                                  Height="40" 
                                  Width="200"
                              />
        </StackPanel>
    </StackPanel>
</Window>
using Syncfusion.Windows.Controls.Input;
using System.Windows;

namespace Demo_Sample
{
    /// <summary>
    /// Interaction logic for SelectedValue.xaml
    /// </summary>
    public partial class SelectedValue : Window
    {
        public SelectedValue()
        {
            InitializeComponent();
            this.DataContext = new EmployeeViewModel();
        }

        private void AutoComplete_SelectedItemChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
        {
            if ((d as SfTextBoxExt).SelectedValue != null)
            {
                MessageBox.Show((d as SfTextBoxExt).SelectedValue.ToString(), "SelectedValue", MessageBoxButton.OK, MessageBoxImage.None);               
            }
        }
    }
}

EmployeeViewModel Class:

using System.Collections.Generic;
using System.Windows;

namespace Demo_Sample
{
    public class EmployeeViewModel
    {
        private List<Employee> employees;
        public List<Employee> Employees
        {
            get { return employees; }

            set { employees = value; }
        }

        public EmployeeViewModel()
        {
            Employees = new List<Employee>();
            Employees.Add(new Employee { Name = "Lucas", Email = "lucas@syncfusion.com", Image = "a0.png" });
            Employees.Add(new Employee { Name = "James", Email = "james@syncfusion.com", Image = "a1.png" });
            Employees.Add(new Employee { Name = "Jacob", Email = "jacob@syncfusion.com", Image = "a2.png" });
        }
    }
}

Employee Class:

    public class Employee
    {
        public string Name { get; set; }
        public string Email { get; set; }
        public string Image { get; set; }
    }

The selected value

Retrieving selected values

AutoComplete provides a way to get the selected values using the SuggestionIndex property.

When an item is selected from suggestion list, their index can be retrieved using the SuggestionIndex property.

The `SuggestionIndex property, holds the index of selected items in suggestion list.

The following code example demonstrates how to retrieve SuggestionIndex.

<Window x:Class="AutoCompleteSample.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:AutoCompleteSample"
        mc:Ignorable="d"
        xmlns:editors="clr-namespace:Syncfusion.Windows.Controls.Input;assembly=Syncfusion.SfInput.Wpf"
        Title="MainWindow" Height="450" Width="800">
    <Window.Content>
        <Grid>
            <editors:SfTextBoxExt x:Name="textBoxExt" 
                              HorizontalAlignment="Center" 
                              VerticalAlignment="Center" 
                              AutoCompleteMode="Suggest"
                              ShowSuggestionsOnFocus="True"
                              SelectedItemChanged="TextBoxExt_SelectedItemChanged"
                              Width="200">
            </editors:SfTextBoxExt>
        </Grid>
    </Window.Content>
</Window>
using Syncfusion.Windows.Controls.Input;
using System.Collections.Generic;
using System.Windows;

namespace AutoCompleteSample
{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        string suggestionIndex;
        public MainWindow()
        {
            InitializeComponent();
            SfTextBoxExt textBoxExt = new SfTextBoxExt()
            {
                HorizontalAlignment = HorizontalAlignment.Center,
                VerticalAlignment = VerticalAlignment.Center,
                Width = 200,
                AutoCompleteMode = AutoCompleteMode.Suggest,
                ShowSuggestionsOnFocus = true
            };

            textBoxExt.SelectedItemChanged += TextBoxExt_SelectedItemChanged;

            List<string> list = new List<string>()
            {
                 "India",
                 "Uganda",
                 "Ukraine",
                 "Canada",
                 "United Arab Emirates"
            };

            textBoxExt.AutoCompleteSource = list;
            this.Content = textBoxExt;
        }

        private void TextBoxExt_SelectedItemChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
        {
            string suggestionIndex = "";
            suggestionIndex = ((d as SfTextBoxExt).SuggestionIndex).ToString();
            MessageBoxResult messageBoxResult = MessageBox.Show(suggestionIndex, "SuggestionIndex");
        }
    }
}

suggestion index

SelectedItem

The SelectedItem property is used to select a particular item from the suggestion list. You can either get or set the SelectedItem.

The following code snippet demonstrates how to set SelectedItem.

<Window x:Class="AutoCompleteSample.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:AutoCompleteSample"
        mc:Ignorable="d"
        xmlns:editors="clr-namespace:Syncfusion.Windows.Controls.Input;assembly=Syncfusion.SfInput.Wpf"
        Title="MainWindow" Height="450" Width="800">
    <Window.Content>
        <Grid>
            <editors:SfTextBoxExt x:Name="textBoxExt" 
                                  HorizontalAlignment="Center" 
                                  VerticalAlignment="Center" 
                                  AutoCompleteMode="Suggest"
                                  SelectedItem="India"
                                  Width="200">
            </editors:SfTextBoxExt>
        </Grid>
    </Window.Content>
</Window>
using Syncfusion.Windows.Controls.Input;
using System.Collections.Generic;
using System.Windows;

namespace AutoCompleteSample
{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
            SfTextBoxExt textBoxExt = new SfTextBoxExt()
            {
                HorizontalAlignment = HorizontalAlignment.Center,
                VerticalAlignment = VerticalAlignment.Center,
                Width = 200,
                AutoCompleteMode = AutoCompleteMode.Suggest,
                SelectedItem = "India"
            };

            List<string> list = new List<string>()
            {
                 "India",
                 "Uganda",
                 "Ukraine",
                 "Canada",
                 "United Arab Emirates"
            };

            textBoxExt.AutoCompleteSource = list;
            this.Content = textBoxExt;
        }
    }
}

selected item

Retrieving selected items

AutoComplete provides a way to get the selected items using the SelectionChanged event.

The following code example demonstrates how to retrieve SelectedItem.

<Window x:Class="AutoCompleteSample.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:AutoCompleteSample"
        mc:Ignorable="d"
        xmlns:editors="clr-namespace:Syncfusion.Windows.Controls.Input;assembly=Syncfusion.SfInput.Wpf"
        Title="MainWindow" Height="450" Width="800">
    <Window.Content>
        <Grid>
            <editors:SfTextBoxExt x:Name="textBoxExt" 
                              HorizontalAlignment="Center" 
                              VerticalAlignment="Center" 
                              AutoCompleteMode="Suggest"
                              ShowSuggestionsOnFocus="True"
                              SelectedItemChanged="TextBoxExt_SelectedItemChanged"
                              Width="200">
            </editors:SfTextBoxExt>
        </Grid>
    </Window.Content>
</Window>
using Syncfusion.Windows.Controls.Input;
using System.Collections.Generic;
using System.Windows;

namespace AutoCompleteSample
{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        string selectedItem;
        public MainWindow()
        {
            InitializeComponent();
            SfTextBoxExt textBoxExt = new SfTextBoxExt()
            {
                HorizontalAlignment = HorizontalAlignment.Center,
                VerticalAlignment = VerticalAlignment.Center,
                Width = 200,
                AutoCompleteMode = AutoCompleteMode.Suggest,
                ShowSuggestionsOnFocus = true
            };

            textBoxExt.SelectedItemChanged += TextBoxExt_SelectedItemChanged;

            List<string> list = new List<string>()
            {
                 "India",
                 "Uganda",
                 "Ukraine",
                 "Canada",
                 "United Arab Emirates"
            };

            textBoxExt.AutoCompleteSource = list;
            this.Content = textBoxExt;
        }

        private void TextBoxExt_SelectedItemChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
        {
            string selectedItem = "";
            if ((d as SfTextBoxExt).SelectedItem != null)
            {
                selectedItem = ((d as SfTextBoxExt).SelectedItem).ToString();
            }

            MessageBoxResult messageBoxResult = MessageBox.Show(selectedItem, "SelectedItem");
        }
    }
}

selected item