How do I access the property of an item in a ListBox in XAML?

Question

I have a listbox of "SmartText" items, which are basically link objects with properties for a title, description, and a url. I'm trying to make the Grid panel in the XAML tappable, so that tapping on the whole Grid navigates to the url. How do I do access the URL property so that I can navigate to it?

<controls:Pivot VerticalAlignment="Stretch"
                HorizontalAlignment="Stretch"
                Margin="0,0,0,0"
                x:Name="PivotRoot"
                Title="{Binding SmartTextStateModel.Title}" 
                SelectionChanged="Pivot_SelectionChanged"
                Background="{StaticResource PhoneBackgroundBrush}">
    <controls:PivotItem Header="{Binding Path=Labels.SmartTextBingHeaderLabel, Source={StaticResource Translations}}" Tag="bingsearch">
        <ListBox ItemsSource="{Binding SmartTextStateModel.BingItemResults}">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <Grid Tap="SmartTextElement_Tap">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="*"/>
                            <RowDefinition Height="Auto"/>
                            <RowDefinition Height="Auto"/>
                        </Grid.RowDefinitions>
                        <TextBlock Grid.Row="0" FontSize="40" Text="{Binding Path=Title}" />
                        <TextBlock Grid.Row="1" TextWrapping="Wrap" FontSize="18.667" Foreground="{StaticResource PhoneDisabledBrush}"
                                   TextTrimming="WordEllipsis" MaxHeight="100" Text="{Binding Path=Description}"/>
                        <TextBlock Grid.Row="2" Foreground="{StaticResource PhoneAccentBrush}" Text="{Binding Path=Url}"/>
                    </Grid>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>
    </controls:PivotItem>

    ...

</controls:Pivot>

and the class definition

public class SmartTextItemModel : BaseModel
{
    private string _title;
    private string _description;
    private string _url;

    /// <summary>
    /// The title of the linked page (Large text)
    /// </summary>
    public string Title
    {
        get { return _title; }
        set
        {
            if (_title != value)
            {
                _title = value;
                NotifyPropertyChanged("Title");
            }
        }
    }

    /// <summary>
    /// Description of the page (smaller text)
    /// </summary>
    public string Description
    {
        get { return _description; }
        set
        {
            if (_description != value)
            {
                _description = value;
                NotifyPropertyChanged("Description");
            }
        }
    }

    /// <summary>
    /// Url of the page
    /// </summary>
    public string Url
    {
        get { return _url; }
        set
        {
            if (_url != value)
            {
                _url = value;
                NotifyPropertyChanged("Url");
            }
        }
    }

    public SmartTextItemModel(string _t, string _d, string _u)
    {
        this._title = _t;
        this._description = _d;
        this._url = _u;
    }
}

Of course the event handler in the .cs file looks like this:

private void SmartTextElement_Tap(object sender, System.Windows.Input.GestureEventArgs e)
{
    ... ?
    // Navigate to url...
}

Note: This was the closest StackOverflow question to mine: How to get the listbox item's properties after event "tap", but it still didn't help.

Answer 1

the Grid is inside the ItemTemplate of the ListBox. That means that the Grid.DataContext property is going to be an instance of your SmartTextItemModel class:

private void SmartTextElement_Tap(object sender, System.Windows.Input.GestureEventArgs e)
{
    var grid = sender as Grid;
    if (grid == null)
        return;

   var item = grid.DataContext as SmartTextItemModel;
   if (item == null)
        return;

   item.// Navigate to url...
}