How to prevent the user from entering his own text in AutoComplete control.

Hi,

I noticed that I am able to enter my own text in the SFAutocomplete control bypassing the values from the dropdown.

How do I ensure that the user cannot enter his own text but needs to select a value from the drop down. How to validate the data whether it is entered via the keyboard or selected from the drop down.

Thanks,

Rajesh.

3 Replies

ET Eswaran Thirugnanasambandam Syncfusion Team November 23, 2017 12:32 PM UTC

Hi Rajesh,

Thanks for contacting Syncfusion support,

Based on your requirement we have prepared a sample to prevent the user from entering the own text in autocomplete control. In our sample, we have performed validation using button click and automatic. We have checked whether the provided text is available in our datasource using selection changed event. If the provided text is available in the datasource then the data will be displayed else, it will be removed. Please find the sample from the below Link.

Link: http://www.syncfusion.com/downloads/support/forum/134671/ze/AutoComplete_134671-2049040610  

Please check the attached sample and let us know if you have any concern on this.

Regards,
Eswaran AT. 



RA Rajesh November 24, 2017 11:04 AM UTC

Hi Easwaran,

Thanks a lot for this sample and it was an excellent solution.

But I noticed certain limitations for this technique.

In my case, I am binding all the autocomplete controls to a ViewModel.

My code is like this.

//autoComplete for Street
clsGlobalData.strTableNameVM = "Status";
txtStreet.BindingContext = new DropDownViewModel(clsGlobalData.strTableNameVM);
txtStreet.DisplayMemberPath = "Data";
txtStreet.SelectedValuePath = "CodeValue";

the XAML Code
<local:AutoComplete  x:Name="txtStreet" Text="" Watermark="Select" Grid.Column="1" Grid.Row="4" ShowSuggestionsOnFocus="True" DataSource="{Binding DropDownDataCollection}" FocusChanged="txtStreet_FocusChanged" SelectionChanged="txt_Street_Completed" />

When debugging the FocusChanged event with the same code that you provided, the value of txtStreet is empty, but on the screen, the text does not get cleared and it is still visible.

So I have the following doubts.

1. Does it work only when binding the autocomplete control with a  list.

List<String> countryNames = new List<String>();
countryNames.Add("Uganda");
countryNames.Add("Ukraine");
countryNames.Add("Canada");
countryNames.Add("United Arab Emirates");
countryNames.Add("France");
countryNames.Add("United Kingdom");
countryNames.Add("China");
countryNames.Add("United States");
countryNames.Add("Japan");
autoComplete.DataSource = countryNames;
autoComplete.SuggestionMode = SuggestionMode.ContainsWithCaseSensitive;
autoComplete1.DataSource = countryNames;
autoComplete1.SuggestionMode = SuggestionMode.ContainsWithCaseSensitive;
Validate.Clicked+= Validate_Clicked;
autoComplete1.FocusChanged += AutoComplete1_FocusChanged;
            
2. Can we use both the FocusChanged and the SelectionChanged event at the same time. I want to use the FocusChanged event
for validating the autocomplete control and the SelectionChanged event to insert/update this value in the database.

3. What is needed to make the autocomplete control clear the text in case it does not match with the DataSource when binding to a ViewModel.

Thanks,

Rajesh.


ET Eswaran Thirugnanasambandam Syncfusion Team November 27, 2017 12:55 PM UTC

Hi Rajesh,

Thanks for your update.

Query1: “Does it work only when binding the autocomplete control with a list.”

The autocomplete accept not only list, it also accepts the custom data . We have prepared sample in which we have used both list and custom data. Please find the sample from the below link given.

Query2: “Can we use both the FocusChanged and the SelectionChanged event at the same time.”

Yes, we can use both the focuschanged and selection changed event at the same time. We have prepared sample in which we have used the focuschanged and selection changed event for validating and insert/deleting the data from the viewmodel . Please find the sample from the below link given.

Query3: “What is needed to make the autocomplete control clear the text in case it does not match with the DataSource when binding to a ViewModel.”

In the focus changed event we can achieve your requirement by checking the datasource with the text present in the autocomplete. We have prepared sample in which we have validated the auto complete text with the datasource. Based on the validation we made the autocomplete control clear the text in case it does not match with the DataSource when binding to a ViewModel. Please find the sample from the below link given.

Sample Link: http://www.syncfusion.com/downloads/support/forum/134671/ze/AutoComplete_GettingStarted922804706  

Regards,
Eswaran AT. 


Loader.
Up arrow icon