How to get SelectedText from AutoComplete?
Step 1: Create a custom autocomplete control.
Step 2: Use a separate property in the view model file to bind the selected item and use another property to get the selected text.
Step 3: Inherit the INotifyPropertyChanged class in view model class.
Step 4: Implement the PropertyChangedEventHandler interface. The property changed event will be raised whenever any property is changed.
Step 5: Create the RaisePropertyChanged method to raise the property changed event.
Step 6: Call the RaisePropertyChanged method inside the Selected item property, which will call the selected text property whenever the selected item property is updated.
Step 7: In the selected text property, get the current selected item text from the autocomplete selected item property.
The following code demonstrates the how to get selected text from auto complete control.
XAML
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:local="clr-namespace:SfAutocompleteSample"
xmlns:input="clr-namespace:Syncfusion.SfAutoComplete.XForms;assembly=Syncfusion.SfAutoComplete.XForms"
xmlns:syncfusion="clr-namespace:Syncfusion.ListView.XForms;assembly=Syncfusion.SfListView.XForms"
x:Class="SfAutocompleteSample.MainPage">
<ContentPage.BindingContext>
<local:ViewModel/>
</ContentPage.BindingContext>
<ContentPage.Content>
<StackLayout>
<input:SfAutoComplete x:Name="AutoComplete2"
BackgroundColor="Bisque"
HeightRequest="100"
SelectedItem="{Binding SelectionObject}"
DataSource="{Binding Colors}"
MultiSelectMode="Token"
BorderColor="Black"
IsSelectedItemsVisibleInDropDown="False"
AutoCompleteMode="SuggestAppend"
WatermarkColor="Blue"
ShowClearButton="True"
SuggestionBoxPlacement="Top"
NoResultsFoundText="No Services Found"
SuggestionMode="Contains"
TextHighlightMode="MultipleOccurrence"
HighlightedTextColor="Red"
HighlightedTextFontAttributes="Bold"
DisplayMemberPath="Name"
TextColor="Black">
</input:SfAutoComplete>
<Label Text="Selected Values are"
Margin="0,10"/>
<ListView x:Name="list2" ItemsSource="{Binding SelectedValue}">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<Label Text="{Binding}" />
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</StackLayout>
</ContentPage.Content>
</ContentPage>
C#
namespace SfAutocompleteSample
{
#region Mainpage Class
public partial class MainPage : ContentPage
{
#region Constructor
public MainPage()
{
InitializeComponent();
}
#endregion
}
#endregion
public class ViewModel : INotifyPropertyChanged
{
public ViewModel()
{
Colors = new ObservableCollection<Model>();
Colors.Add(new Model() { ID = "1", Name = "Red" });
Colors.Add(new Model() { ID = "2", Name = "Pink" });
Colors.Add(new Model() { ID = "3", Name = "Orange" });
Colors.Add(new Model() { ID = "4", Name = "Lavendar" });
Colors.Add(new Model() { ID = "5", Name = "Violet" });
Colors.Add(new Model() { ID = "6", Name = "Indigo" });
Colors.Add(new Model() { ID = "7", Name = "White" });
Colors.Add(new Model() { ID = "8", Name = "Green" });
Colors.Add(new Model() { ID = "9", Name = "Blue" });
Colors.Add(new Model() { ID = "10", Name = "Yellow" });
SelectionObject.Add(Colors[1]);
}
private ObservableCollection<object> selectionobject = new ObservableCollection<object>();
public ObservableCollection<object> SelectionObject
{
get { return selectionobject; }
set
{
selectionobject = value;
RaisePropertyChanged("SelectionObject");
RaisePropertyChanged("SelectedValue");
}
}
private ObservableCollection<string> selectedvalue = new ObservableCollection<string>();
public ObservableCollection<string> SelectedValue
{
get
{
selectedvalue.Clear();
foreach (var item in SelectionObject)
{
selectedvalue.Add((item as Model).Name.ToString());
}
return selectedvalue;
}
set
{
selectedvalue = value;
}
}
private ObservableCollection<Model> _colors;
public ObservableCollection<Model> Colors
{
get { return _colors; }
set
{
_colors = value;
RaisePropertyChanged("Colors");
}
}
public event PropertyChangedEventHandler PropertyChanged;
public void RaisePropertyChanged(string name)
{
if (PropertyChanged != null)
PropertyChanged(this, new PropertyChangedEventArgs(name));
}
}
public class Model
{
private string id;
public string ID
{
get { return id; }
set { id = value; }
}
private string name;
public string Name
{
get { return name; }
set { name = value; }
}
}
}
The following screenshot illustrates customized return keyboard.
Please find the sample from the below link:
https://www.syncfusion.com/downloads/support/forum/139491/ze/SfAutocompleteSample_GetText1775718278
Conclusion
I hope you enjoyed learning about how to get selectedtext from AutoComplete.
You can refer to our Xamarin.Forms Autocomplete feature tour page to know about its other groundbreaking feature representations and documentation, and how to quickly get started for configuration specifications.
For current customers, you can check out our components from the License and Downloads page. If you are new to Syncfusion, you can try our 30-day free trial to check out our other controls.
If you have any queries or require clarifications, please let us know in the comments section below. You can also contact us through our support forums, Direct-Trac, or feedback portal. We are always happy to assist you!
