Named Items in XAML don't Exist in Current Context

Question

I am working on a school project, and I need to have items bound between my XAML and C# code. I have defined the names in the XAML file, but the C# code is reporting that some of the items do "not exist in the current context." The variables in the C# with this error are:

StartDatePicker
EndDatePicker
InstructorName
InstructorEmail
InstructorPhone

I have replaced these items by copying and pasting the x:Name fields from the XAML file, cleaned all of the files and rebuilt the solution, but am still receiving the error.

The affected C# code blocks:

public CourseInfoPage(Courses selectedCourse)
        {
            InitializeComponent();
            thisCourse = selectedCourse;
            courseId = thisCourse.Id;
            int courseInstructorId = thisCourse.Instructor;
            GetCourseInstructor(courseInstructorId);
            StartDatePicker.Date = thisCourse.RealStartDate;
            EndDatePicker.Date = thisCourse.RealEndDate;
        }
private void GetCourseInstructor(int courseInstructorId)
        {
            using (SQLiteConnection conn = new SQLiteConnection(App.DBLocation))
            {
                var instructorName = conn.Query<Instructors>($"SELECT FirstName, LastName FROM Instructors WHERE Id = {courseInstructorId}");
                var email = conn.Query<Instructors>($"SELECT Email FROM Instructors WHERE Id = {courseInstructorId}");
                var phone = conn.Query<Instructors>($"SELECT Phone FROM Instructors WHERE Id = {courseInstructorId}");

                InstructorName.Text = instructorName.ToString();
                InstructorEmail.Text = email.ToString();
                InstructorPhone.Text = phone.ToString();
            }
        }

The XAML CollectionView:

<CollectionView x:Name="CourseInfoView">
            <CollectionView.ItemTemplate>
                <DataTemplate>
                    <Grid Padding="10">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto"/>
                            <RowDefinition Height="Auto"/>
                            <RowDefinition Height="Auto"/>
                            <RowDefinition Height="Auto"/>
                            <RowDefinition Height="Auto"/>
                            <RowDefinition Height="Auto"/>
                            <RowDefinition Height="Auto"/>
                            <RowDefinition Height="Auto"/>
                            <RowDefinition Height="Auto"/>
                        </Grid.RowDefinitions>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="Auto"/>
                            <ColumnDefinition Width="Auto"/>
                        </Grid.ColumnDefinitions>
                        <Label Grid.Column="0"
                               Grid.Row="0"
                               Text="{Binding CourseID}"
                        <Label Grid.Column="1"
                               Grid.Row="0"
                               Text="{Binding CourseName}"
                        <Label Grid.Column="0"
                               Grid.Row="1"
                               Text="Start Date:"
                        <DatePicker x:Name="StartDatePicker"
                                    MinimumDate="01/01/2020"
                                    MaximumDate="12/31/2050"
                                    Date="{Binding RealStartDate}"
                                    DateSelected="OnDateSelected"
                                    Grid.Column="1"
                                    Grid.Row="1"
                            <DatePicker.Format>MM/dd/yyyy</DatePicker.Format>
                        </DatePicker>
                        <Label Grid.Column="0"
                               Grid.Row="2"
                               Text="End Date:"
                        <DatePicker x:Name="EndDatePicker"
                                    MinimumDate="02/01/2020"
                                    MaximumDate="01/01/2051"
                                    Date="{Binding RealEndDate}"
                                    DateSelected="OnDateSelected"
                                    Grid.Column="1"
                                    Grid.Row="2"
                            <DatePicker.Format>MM/dd/yyyy</DatePicker.Format>
                        </DatePicker>
                        <Label Grid.Column="0"
                               Grid.Row="3"
                               Text="Select a status:"
                        <Picker x:Name="picker"
                                Grid.Column="1"
                                Grid.Row="3">
                            <Picker.ItemsSource>
                                <x:Array Type="{x:Type x:String}">
                                    <x:String>Not Started</x:String>
                                    <x:String>In Progress</x:String>
                                    <x:String>Completed</x:String>
                                    <x:String>Not Passed</x:String>
                                </x:Array>
                            </Picker.ItemsSource>
                        </Picker>
                        <Label Grid.Column="0"
                               Grid.Row="4"
                               Text="Course Instructor:"
                        <Label Grid.Column="1"
                               Grid.Row="4"
                               x:Name="InstructorName"
                        <Label Grid.Column="0"
                               Grid.Row="5"
                               Text="Instructor Email:"
                        <Label Grid.Column="1"
                               Grid.Row="5"
                               x:Name="InstructorEmail"
                        <Label Grid.Column="0"
                               Grid.Row="6"
                               Text="Instructor Phone:"
                        <Label Grid.Column="1"
                               Grid.Row="6"
                               x:Name="InstructorPhone"
                        <Label Grid.Column="0"
                               Grid.Row="7"
                               Text="Course Description:"
                        <Label Grid.ColumnSpan="2"
                               Grid.Row="8"
                               Text="{Binding CourseDescription}"
                        <Button x:Name="courseNotesButton"
                                Text="View Course Notes"
                                Clicked="courseNotesButton_Clicked"/>
                    </Grid>
                </DataTemplate>
            </CollectionView.ItemTemplate>
        </CollectionView>

I'm certain it's something simple that I'm missing, but I can't see what it is. Any help anyone can provide would be super; thanks!

Answer 1

You are using a DataTemplate, that means the names will not be available in the code-behind. The template is something that is inflated at runtime whenever there is a need. It's impossible to refer to controls like this inside a DataTemplate. The template will be repeated for each item in the underlying collection.

You will want to look at using MVVM and data-binding. Globally that means; put all your Course objects into a collection, preferably a ObservableCollection. Then set the CollectionView.ItemsSource to that collection.

You won't need the x:Name attributes, instead the {Binding MemberName} will be used to fill the right values. I see you are already using that so that is great.