NullReferenceException while adding item to ObservableCollection

Question

I am trying to add an object to an ObservableCollection. As mentioned in a few question on this very site, I even tried to instantiate the collection before adding item. However, I am still getting the error. Here is my observation collection:

//Datacontext for local database
private WordDataContext wordsDB;

//Observable collection for binding
private ObservableCollection<WordItem> _wordItems = new ObservableCollection<WordItem>();
public ObservableCollection<WordItem> WordItems
{
    get
    {
        return _wordItems;
    }
    set
    {
        if (_wordItems != value)
        {
            _wordItems = value;
            NotifyPropertyChanged("WordItems");
        }
    }
}

I have overridden onNavigatedTo

    protected override void OnNavigatedTo(System.Windows.Navigation.NavigationEventArgs e)
    {
        // Define the query to gather all of the idea items.
        var wordItemsInDB = from WordItem word in wordsDB.WordItems
                            select word;

        // Execute the query and place the results into a collection.
        WordItems = new ObservableCollection<WordItem>(wordItemsInDB);

        // Call the base method.
        base.OnNavigatedTo(e);
    }

And here is the button to add new item

    private void newIdeaAddButton_Click(object sender, RoutedEventArgs e)
    {
        //// Create a new idea item based on the text box.
        //WordItem newIdea = new WordItem { WordName = "TestTest" };
        //Debug.WriteLine("I'm here!");
        //// Add a idea item to the observable collection.
        //WordItems.Add(newIdea);

        //// Add a idea item to the local database.
        //wordsDB.WordItems.InsertOnSubmit(newIdea);
        WordItem newword = new WordItem { WordName = "Bingo" };
        if (WordItems == null)
        {
            Debug.WriteLine("I'm null!");
            WordItems = new ObservableCollection<WordItem>();
        }

        WordItems.Add(newword);
        wordsDB.WordItems.InsertOnSubmit(newword);
        Debug.WriteLine("Did something!");
    }

And here's the XAML

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
        <!--<ListBox Margin="14,0,-12,0" FontSize="{StaticResource PhoneFontSizeExtraLarge}" FontFamily="{StaticResource PhoneFontFamilySemiLight}">
            <ListBoxItem Content="About" Tap="GoToAbout"/>
        </ListBox>-->
        <telerikData:RadJumpList x:Name="TestList" IsStickyHeaderEnabled="True" Margin="14,0,-12,0" ItemsSource="{Binding WordItems}">
            <telerikData:RadJumpList.ItemTemplate>
                <DataTemplate>                                                    
                    <StackPanel Orientation="Horizontal" Height="74">                                    
                        <Rectangle x:Name="Bully" Width="20" Fill="Gray" Height="62" VerticalAlignment="Top" HorizontalAlignment="Left" />
                        <TextBlock Style="{StaticResource PhoneTextExtraLargeStyle}" Text="{Binding WordItem}" VerticalAlignment="Top"/>
                    </StackPanel>                        
                </DataTemplate>
            </telerikData:RadJumpList.ItemTemplate>

            <telerikData:RadJumpList.StickyHeaderTemplate>                    
                <DataTemplate>
                    <Border HorizontalAlignment="Stretch" Background="{StaticResource PhoneBackgroundBrush}" Height="74">
                        <Border Background="{StaticResource PhoneAccentBrush}" VerticalAlignment="Top" HorizontalAlignment="Left" Width="62" Height="62">
                            <TextBlock Text="{Binding}" FontFamily="{StaticResource PhoneFontFamilySemiLight}" FontSize="{StaticResource PhoneFontSizeExtraLarge}" Padding="7,0,0,0" VerticalAlignment="Bottom" Foreground="White" />
                        </Border>
                    </Border>
                </DataTemplate>
            </telerikData:RadJumpList.StickyHeaderTemplate>

            <telerikData:RadJumpList.GroupHeaderTemplate>
                <DataTemplate>
                    <Border HorizontalAlignment="Stretch" Background="{StaticResource PhoneBackgroundBrush}" Height="74">
                        <Border Background="{StaticResource PhoneAccentBrush}" VerticalAlignment="Top" HorizontalAlignment="Left" Width="62" Height="62">
                            <TextBlock Text="{Binding}" FontFamily="{StaticResource PhoneFontFamilySemiLight}" FontSize="{StaticResource PhoneFontSizeExtraLarge}" Padding="7,0,0,0" VerticalAlignment="Bottom" Foreground="White" />
                        </Border>
                    </Border>
                </DataTemplate>
            </telerikData:RadJumpList.GroupHeaderTemplate>

            <telerikData:RadJumpList.GroupPickerItemsPanel>
                <ItemsPanelTemplate>
                    <toolkit:WrapPanel HorizontalAlignment="Center" ItemHeight="111" ItemWidth="111"/>
                </ItemsPanelTemplate>
            </telerikData:RadJumpList.GroupPickerItemsPanel>

            <telerikData:RadJumpList.GroupPickerItemTemplate>
                <DataTemplate>
                    <Border Background="{StaticResource PhoneAccentBrush}" Width="99" Height="99" VerticalAlignment="Top" HorizontalAlignment="Left">
                        <TextBlock Text="{Binding}" Style="{StaticResource PhoneTextExtraLargeStyle}" VerticalAlignment="Bottom" Foreground="White" />
                    </Border>
                </DataTemplate>
            </telerikData:RadJumpList.GroupPickerItemTemplate>
        </telerikData:RadJumpList>
        <Button x:Name="newIdeaAddButton" Click="newIdeaAddButton_Click" Content="Button" Height="72" HorizontalAlignment="Left" Margin="10,10,0,0" VerticalAlignment="Top" Width="160" />
    </Grid>

Answer 1

Okay, I finally got the solution! The problem in itself is a bit obscure. The thing is that, earlier, I had RadJumplist bound to a List<strings> and it had GroupDescriptor defined accordingly

GenericGroupDescriptor<string, string> testgroup = new GenericGroupDescriptor<string, string>(listitem => listitem.Substring(0, 1).ToLower());

However, the scenario in question is about ObservableCollection<WordItem> . As soon as an item is added to the collection, the RadJumpList is notified about those changes and the GroupDescriptor proves to be invalid in that context. That somehow raises the NullReferenceException . It's a bit unintuitive to relate the error with the cause.

So, the simple solution was to change the descriptor as follows

GenericGroupDescriptor<WordItem, string> gengd = new GenericGroupDescriptor<WordItem, string>();
        gengd.KeySelector = (WordItem item) =>
            {
                char keyhead = item.WordName[0];
                return keyhead.ToString().ToLower();
            };

This thing is not really well documented!