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; }
}
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");
}
}
}
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;
}
}
}
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");
}
}
}