How do I create a dynamic table with rows and columns using the windows 7 platform

Question

I am making a app for roller derby that will get information such as bouts , team names and stats. The information is stored in the JSON format. When I eventually get and parse the data i want to arrange in in a format similar to this: Team1 Team2 Venue Date Result. The amount of rows should be the length of each list of bouts. I am having trouble finding a way to do this in the C# code. Can anyone point me in the right direction.

Edit: I have tried implementing a list box and I am trying to follow the tutorial found here http://msdn.microsoft.com/en-us/library/cc265158%28v=vs.95%29.aspx

When I run the program I get this error message: Error 1 Event handler 'PhoneApplicationPage_Loaded' not found on class 'PhoneApp2.Page1' c:\\users\\lewis\\documents\\visual studio 2010\\Projects\\PhoneApp2\\PhoneApp2\\Page1.xaml Roller Derby App

Here is my Xaml for page1

<!--LayoutRoot is the root grid where all page content is placed-->
<Grid x:Name="LayoutRoot" Background="Transparent">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>

    <!--TitlePanel contains the name of the application and page title-->
    <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
        <TextBlock x:Name="ApplicationTitle" Text="MY APPLICATION" Style="{StaticResource PhoneTextNormalStyle}"/>
        <TextBlock x:Name="PageTitle" Text="Upcoming Bouts" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}" Width="297" TextWrapping="NoWrap" FontSize="40" HorizontalAlignment="Left" />
        <Button Name="Home" Content="Home" Width="310" HorizontalContentAlignment="Center" HorizontalAlignment="Left" Click="Home_Click" />
    </StackPanel>

    <!--ContentPanel - place additional content here-->
    <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
        <ListBox Height="100" HorizontalAlignment="Left" Margin="544,177,0,0" Name="ListofBouts" VerticalAlignment="Top" Width="460" Loaded="ListofBouts_Loaded">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <StackPanel Orientation="Horizontal">
                        <TextBlock Padding="5,0,5,0"
                     Text="{Binding Venue}" />
                        <TextBlock Text="{Binding Team1}" />
                        <TextBlock Text="{Binding Team2}"/>
                        <TextBlock Text="{Binding Date}"/>
                    </StackPanel>
                </DataTemplate>
            </ListBox.ItemTemplate>

            </ListBox>

    </Grid>
</Grid>

<!--Sample code showing usage of ApplicationBar-->
<!--<phone:PhoneApplicationPage.ApplicationBar>
    <shell:ApplicationBar IsVisible="True" IsMenuEnabled="True">
        <shell:ApplicationBarIconButton IconUri="/Images/appbar_button1.png" Text="Button 1"/>
        <shell:ApplicationBarIconButton IconUri="/Images/appbar_button2.png" Text="Button 2"/>
        <shell:ApplicationBar.MenuItems>
            <shell:ApplicationBarMenuItem Text="MenuItem 1"/>
            <shell:ApplicationBarMenuItem Text="MenuItem 2"/>
        </shell:ApplicationBar.MenuItems>
    </shell:ApplicationBar>
</phone:PhoneApplicationPage.ApplicationBar>-->

Here is the C#

namespace PhoneApp2
{
  public partial class Page1 : PhoneApplicationPage
  {
    public Page1()
    {
        InitializeComponent();
    }

    private void Home_Click(object sender, RoutedEventArgs e)
    {
        NavigationService.Navigate(new Uri("/MainPage.xaml", UriKind.Relative));
    }

    private void ListofBouts_Loaded(object sender, RoutedEventArgs e)
    {
        InitializeComponent();
    }
    public class Bouts
    {
        public string Venue { get; set; }
        public string Team1 { get; set; }
        public string Team2 { get; set; }
        public string Date { get; set; }

        public Bouts(String venue, String team1, String team2, String date)
        {

            this.Venue = venue;
            this.Team1 = team1;
            this.Team2 = team2;
            this.Date = date;

        }
    }


    public class bouts : ObservableCollection<Bouts>
    {
        public bouts()
        {
            Add(new Bouts("Yankee Sadium", "Yankees", "Mets", "March 3"));
            Add(new Bouts("Yankee Sadium", "Yankees", "Mets", "March 3"));
            Add(new Bouts("Yankee Sadium", "Yankees", "Mets", "March 3"));
            Add(new Bouts("Yankee Sadium", "Yankees", "Mets", "March 3"));

        }
    }

  }
}

Answer 1

The error is saying that there is an event defined the Loaded event for Page1 . Since the event is not defined in the code-behind, it must be declared in the XAML:

<phone:PhoneApplicationPage
  x:Class="PhoneApp2.Pag1"
  Loaded="PhoneApplicationPage_Loaded"
  OtherStuff...
  >
  <RestOfXaml>

Delete the Loaded="PhoneApplicationPage_Loaded" and the error should go away. Or define the event in the code behind. Either should work.