AutocompleteView suggestion not working

[George]

Details are binded to the itemsource of AutocompleteView, but in suggestion list, it's showing "no items to show". Is there any further filtering is doing anonymously?

[Didi]

Hi George,

Could you please check whether the TextSearchPath property of the AutoCompleteView is set.

Please note that the TextSearchPath property is required in data binding scenarios as the ItemsSource property. A sample demos with the AutoCompleteView control can be found is our Xamarin Samples Demo Application and SDK Browser app. 

More details about data binding can be checked at the following link from our documentation:

https://docs.telerik.com/devtools/xamarin/controls/autocompleteview/autocompleteview-data-binding

If the issue still observes, I would like to ask you to open a support ticket and attach a sample repro project there. In this way we could research the case further. Also include the following information: 
- versions of Xamarin and Telerik used in the project.
- on which OS the issue occurs.
- version of the device/emulator/simulator.

Regards,
Didi
Progress Telerik

[George]

Hi Didi,

Thanks for the response. What should be the value inside the TextSearchPath property,  Especially if the Autocomplete View's itemsource is binded to an observable collection of string?

[Didi]

Hi,

If the collection is of type string, here is a sample example how the binding is set to the TextSearchPath:

<telerikInput:RadAutoCompleteView x:Name="autoCompleteView" 
                                    Watermark="Search here..." 
                                    ItemsSource="{Binding Items}" 
                                    TextSearchPath="{Binding .}" />

and the ViewModel:

public class ViewModel
{
    public ObservableCollection<string> Items { get; set; }
    public ViewModel()
    {
        this.Items = new ObservableCollection<string>()
        {
            "Freda Curtis",
            "Jeffery Francis",
            "Eva Lawson",
            "Emmett Santos",
            "Theresa Bryan",
            "Jenny Fuller",
            "Terrell Norris",
            "Eric Wheeler",
            "Julius Clayton",
            "Alfredo Thornton",
            "Roberto Romero",
            "Orlando Mathis",
            "Eduardo Thomas",
            "Harry Douglas"
        };
    }
}

More about Xamarin Forms data binding review the following article from the Microsoft documentation: https://docs.microsoft.com/en-us/xamarin/xamarin-forms/xaml/xaml-basics/data-binding-basics

Regards,
Didi
Progress Telerik

[George]

Hi Didi,

Still Autocomplete View does not show any content, if there is space in between the Itemsource elements.  
One more case, The following is the model I need to bind

public class GooglePlaceAutoCompletePrediction
{
    public string Description { get; set; }
    public string Id { get; set; }
    public string PlaceId { get; set; }
    public StructuredFormatting StructuredFormatting { get; set; }
}

public class StructuredFormatting
{
    public string MainText { get; set; }
    public string SecondaryText { get; set; }
}

public class GooglePlaceAutoCompleteResult
{
    public List<GooglePlaceAutoCompletePrediction> AutoCompletePlaces { get; set; }
}

My current xaml is

<telerikInput:RadAutoCompleteView x:Name="autoCompleteView"
      TextChanged="OriginEntry_TextChanged"
      VerticalOptions="Start"
      CompletionMode="Contains"
      IsClearButtonVisible="False"
      Watermark="Search here...">
    <telerikInput:RadAutoCompleteView.SuggestionItemTemplate>
        <DataTemplate>
            <ViewCell>
                <Grid Padding="15"
                      RowSpacing="2"
                      ColumnSpacing="15">

                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto"/>
                        <RowDefinition Height="Auto"/>
                    </Grid.RowDefinitions>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="Auto"/>
                        <ColumnDefinition Width="*"/>
                    </Grid.ColumnDefinitions>

                    <Image Source="map.png"
                         HeightRequest="20"
                         WidthRequest="20"
                         VerticalOptions="Start"
                         Grid.Row="0"
                         Grid.Column="0"
                         Grid.RowSpan="2"/>

                    <Label LineBreakMode="MiddleTruncation"
                        Text="{Binding StructuredFormatting.MainText, Mode=TwoWay, Converter={StaticResource nothingCoverter}}"
                        Grid.Row="0"
                        Grid.Column="1"/>

                    <Label LineBreakMode="MiddleTruncation"
                         Text="{Binding StructuredFormatting.SecondaryText, Mode=TwoWay, Converter={StaticResource nothingCoverter}}"
                         TextColor="Gray"
                         Grid.Row="1"
                         Grid.Column="1"/>
                </Grid>
            </ViewCell>
        </DataTemplate>
    </telerikInput:RadAutoCompleteView.SuggestionItemTemplate>
</telerikInput:RadAutoCompleteView>

and the code behind is

public ObservableCollection<GooglePlaceAutoCompletePrediction> Places { get; set; }
private async void OriginEntry_TextChanged(object sender, TextChangedEventArgs e)
{
    string placeText = autoCompleteView.Text;
    if (placeText != string.Empty)
    {
        var places = await googleMapsApi.GetPlaces(placeText);
        var placeResult = places.AutoCompletePlaces;
        if (placeResult != null)
        {
            Places = new ObservableCollection<GooglePlaceAutoCompletePrediction>(placeResult);
        }
        autoCompleteView.ItemsSource = Places;
        autoCompleteView.SetBinding(RadAutoCompleteView.TextSearchPathProperty, ".");
    }
}

I need to bind the 'Places' as Itemsource of Autocomplete View.

[Ajith]

Hi Didi,

I am having a auto completion View and the suggestions are fetched through api request. I just require to populate the whole suggestion that is being received through api call. I can see that by default it it provides 2 filtering options starts-with and contains. Can you please suggest a way to avoid the control filtering? Here the data is being returned after matching algorithm run remotely. 

[Didi]

Hi George,

Thank you for the provided code. 

I have created a sample based on it. Please download it and review how the bindings are set.

Note that the solution I have provide in this reply, is when the collection is of type string. From your last reply I have noticed that the collection you are using is not of type string, it is of type GooglePlaceAutoCompletePrediction, so the suggested binding will not work in this case. If some issues with the binding occurs, I would like to ask you to open a support ticket and attach a repro project there. Thank you for the understanding.

Please review our SDK Examples and Sample Demos about the AutoCompleteView for ideas how the ItemsSource and the TextSearchPath could be set.

Another helpful article is how to apply custom filtering to the control. - for more details review our Filtering article.

I hope this will help.

Regards,
Didi
Progress Telerik

[Didi]

Hi Ajith,

If I have understood you correctly, you have filtered your data remotely and you want to visualize the filtered data inside the AutoCompleteView control. If this is the case, then you need to implement a custom filtering. For example you need to create a class that implements the IAutoCompleteFilter interface.

For more details please review the Filtering article from our documentation and sample demo can be found here https://github.com/telerik/xamarin-forms-sdk/tree/master/XamarinSDK/SDKBrowser/SDKBrowser/Examples/AutoCompleteViewControl/FeaturesCategory/CustomFilteringExample.

Please note that this is just a sample and you need to implement the custom logic needed, in order to match the requirements you have. 

Regards,
Didi
Progress Telerik