Databinding an Auto Complete Box in Windows Phone

DZone's Guide to

Databinding an Auto Complete Box in Windows Phone

Senthil Kumar

Nov. 16, 11 · Mobile Zone ·

Free Resource

Like (0)

Comment (0)

Save

{{ articles[0].views | formatCount}} Views

The Auto Complete Box is one of the controls that is a part of the Silverlight Toolkit for Windows Phone, which just got a new release this week!

One of the features of the AutoCompleteBox is that when a user types a character or keyword , the control will show the related words in the drop down list .

To add the Auto Complete Box , make sure you have installed the Silverlight Toolkit for Windows Phone and added the Silverlight Toolkit controls to the toolbox .

Just Drag and Drop the control "AutoCompleteBox" from the toolbox to the xaml page

The XAML code for the Auto Complete Text box will look like this

<toolkit:AutoCompleteBox Grid.Row="1" Height="80" HorizontalAlignment="Left" Margin="41,156,0,0" Name="autoCompleteBox1" VerticalAlignment="Top" Width="403" />

Alternatively you can also create the Auto Complete Box in the Code Behind form .

1. Add the namespace - Microsoft.Phone.Controls namespace . Make sure that the Microsoft.Phone.Controls.Toolkit assembly is added via Add Reference

2. Define the Data i.e List of String and assign the data to the ItemSource property of the AutoComplete object and add the AutoCompleteBox to the container (StackPanel) .

public void AddAutocomplete()

{

AutoCompleteBox txtbox = new AutoCompleteBox();

stack.Children.Add(txtbox);

// Data

txtbox.ItemsSource = GetSports();

}

public List<string> GetSports()

{

List<string> Sports = new List<string>();

Sports.Add("Cricket");

Sports.Add("Tennis");

Sports.Add("Table Tennis");

Sports.Add("Hockey");

Sports.Add("Football");

return Sports;

}

Now , Run the Windows Phone App and start typing first few charcters in the AutoCompleteBox . You should see the list of Suggestions based on the set of data provided as ItemSource .