Search code examples
c#silverlightwindows-phone-7xamlsilverlight-toolkit

ListPicker Set Selected Index not refreshes the UI in WP7 after async call

I have two silverlight listpicker controls in my windows phone 7.

Here is my XAML for that.

// First listpicker for country names

    <toolkit:ListPicker x:Name="listPickerCountryLogin" SelectionChanged="listPickerCountryLogin_SelectionChanged" Height="72" HorizontalAlignment="Left" Margin="14,43,0,0" VerticalAlignment="Top" Width="436" FullModeHeader="Select Country" Background="White" BorderBrush="White" Foreground="{StaticResource listPickerBrush}">
                            <toolkit:ListPicker.ItemTemplate>
                                <DataTemplate>
                                    <StackPanel Orientation="Horizontal">
                                        <TextBlock Text="{Binding Country}" Width="250" />
                                    </StackPanel>
                                </DataTemplate>
                            </toolkit:ListPicker.ItemTemplate>
                            <toolkit:ListPicker.FullModeItemTemplate>
                                <DataTemplate>
                                    <StackPanel Orientation="Horizontal">
                                        <TextBlock Text="{Binding Country}" Width="300" Margin="0,0,0,20" FontSize="24"/>
                                    </StackPanel>
                                </DataTemplate>
                            </toolkit:ListPicker.FullModeItemTemplate>
                        </toolkit:ListPicker>

// and here is my second listpciker for country codes

                    <toolkit:ListPicker x:Name="listPickerCCLogin" SelectionChanged="listPickerCCLogin_SelectionChanged" Height="56.3" Width="80" HorizontalAlignment="Left" Margin="14,100,0,0"  VerticalAlignment="Top" FullModeHeader="Select Country" Background="White" BorderBrush="White" Foreground="{StaticResource listPickerBrush}">
                        <toolkit:ListPicker.ItemTemplate>
                            <DataTemplate>
                                <StackPanel Orientation="Horizontal">
                                    <TextBlock Name="lblCC" Text="{Binding CC}" Width="235" />
                                </StackPanel>
                            </DataTemplate>
                        </toolkit:ListPicker.ItemTemplate>
                        <toolkit:ListPicker.FullModeItemTemplate>
                            <DataTemplate>
                                <StackPanel Orientation="Horizontal">
                                    <TextBlock  Text="{Binding Country}" Width="300" Margin="0,0,0,20" FontSize="24"/>
                                </StackPanel>
                            </DataTemplate>
                        </toolkit:ListPicker.FullModeItemTemplate>
                    </toolkit:ListPicker>

Now Scenario is if user selects the country name then it will automatically set country code of that country as well and vice versa.

for this thing I am using listpicker selection change events for both lists.

Here is my C# code.

First I am binding my listpickers with collection of countries in this method.

/// <summary>
        /// Binding All Listpickers With Data
        /// </summary>
        protected void BindListPickers()
        {
            CountryListParser oCountryList = new CountryListParser();
            this.listPickerCountryLogin.ItemsSource = oCountryList.GetAllCountries();
            this.listPickerCCLogin.ItemsSource = oCountryList.GetAllCountries();
        }

And here is list picker selection change events.

  /// <summary>
        /// Country List Picker Of Login Selection Change Event
        /// </summary>
        /// <param name="sender"></param>
        /// <param name="e"></param>
        private void listPickerCountryLogin_SelectionChanged(object sender, SelectionChangedEventArgs e)
        {
            if (listPickerCountryLogin.SelectedIndex >= 0 && listPickerCountryLogin.SelectedIndex < listPickerCCLogin.Items.Count)
                listPickerCCLogin.SelectedIndex = listPickerCountryLogin.SelectedIndex;
        }

/// <summary>
/// Country Code List Picker Of Login Selection Change Event
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
private void listPickerCCLogin_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
    if (listPickerCCLogin.SelectedIndex >= 0 && listPickerCCLogin.SelectedIndex < listPickerCountryLogin.Items.Count)
        listPickerCountryLogin.SelectedIndex = listPickerCCLogin.SelectedIndex;
}

Still up my code works fine without any error. Now come the tricky and difficult part where I am stucked. I am calling one Google service and passes the lat long of user and it returns me user country and I want set that country to my list pickers.

Here is My Code

protected void OnLocationServiceResponseRecieved(string response)
        {
            JObject o = JObject.Parse(response);
            string Country = (string)o["countryname"];

            Dispatcher.BeginInvoke(new System.Action(delegate()
            {
                CountryListParser oCountryList = new CountryListParser();
                int countrytIndex = oCountryList.CountryIndexByName(Country);
                this.listPickerCountryLogin.SelectedIndex = countrytIndex;
                this.listPickerCCLogin.SelectedIndex = countrytIndex;
            }));
        }

still there no exceptions come and everything goes well and it sets my listpicker selected index as per my country but it not updates the UI of my listpicker and do them blank or you can say empty. But as I tap on my listpicker in backend my desired country is already set. But not updated or stucked in UI thread. 

So problem is UI is not updated properly

=== UPDATE ===

My Sample Code Where Issue Is Reproducing

My finding is in my attached project in selected index method when index is above 38. It will goes blank. I dont know why its behaving like this way..

Solution

  • I have fixed that issue after 3 days struggle. Earlier I was thinking it was Problem in My UI thread and its not got refreshing. And I focused on that part as I was assuming thats the Issues. But in 3rd Day I noticed that might be this can be wrong in listpicker control. And I studied on codeplex. Some people also facing this problem. But How I Rectified let me tell you. I did four steps

    1. I removed all the reference of silverlight toolkit from my project and cleaned the solution.

    2. I installed the silverlight toolkit from pc and then installed the Nov-2011 stable version and restarted PC and referred the dll in my project from this new installation.

    3. I binded selected index as well with my listpicker control.

                  <toolkit:ListPicker x:Name="listPickerCountryLogin" SelectionChanged="listPickerCountryLogin_SelectionChanged" Height="72" HorizontalAlignment="Left" Margin="14,43,0,0" VerticalAlignment="Top" Width="436" FullModeHeader="Select Country" Background="White" BorderBrush="White" Foreground="{StaticResource listPickerBrush}">
                <toolkit:ListPicker.Resources>
                    <Style TargetType="toolkit:ListPickerItem">
                        <Setter Property="Padding" Value="8 6"/>
                    </Style>
                </toolkit:ListPicker.Resources>
                <toolkit:ListPicker.Style>
                    <StaticResource ResourceKey="ListPickerStyle"/>
                </toolkit:ListPicker.Style>
                <toolkit:ListPicker.ItemTemplate>
                    <DataTemplate>
                        <StackPanel Orientation="Horizontal">
                            <TextBlock Text="{Binding Country}" Width="250" />
                        </StackPanel>
                    </DataTemplate>
                </toolkit:ListPicker.ItemTemplate>
                <toolkit:ListPicker.FullModeItemTemplate>
                    <DataTemplate>
                        <StackPanel Orientation="Horizontal">
                            <TextBlock Text="{Binding Country}" Width="300" Margin="0,0,0,20" FontSize="24"/>
                        </StackPanel>
                    </DataTemplate>
                </toolkit:ListPicker.FullModeItemTemplate>
            </toolkit:ListPicker>