Getting 500 Response on Ajax Call in Razor Page View Component

Question

I am working on an ASP.NET 7 project where I have a Razor page, and I have used Ajax to call the GET method from the C# file.

I am calling the GET method from the CSHTML using Ajax to CSHTML.CS. There, I have deleted an item from the list and passed the new model to the view component. Then, I have returned the data to my Ajax to update the new page. But it gives me a 500 response.

This is the source code:

cshtml.cs file

            public void LoadData()
        {
            _sessionService.ClearAllSessions();

            // Store the list in session
            _sessionService.SetSensitiveSessionData("ItemList", itemList, TimeSpan.FromMinutes(30));

            // Retrieve the list from session
            RetrievedItemList = _sessionService.GetSensitiveSessionData<List<D>>("ItemList");

            //OnlineCourseSelectionVM = _sessionService.GetSensitiveSessionData<OnlineCourseSelectionViewModel>("courseVM");
            OnlineCourseSelectionViewModel OnlineCourseSelectionVM = _sessionService.GetSensitiveSessionData<OnlineCourseSelectionViewModel>("courseVM");



            _sessionService.SetSensitiveSessionData("courseVM", OnlineCourseSelectionVM, TimeSpan.FromMinutes(30));
            var test = _sessionService.GetSensitiveSessionData<OnlineCourseSelectionViewModel>("courseVM");
        }

        public IActionResult OnGetRemoveItem(int eventId)
        {
            LoadData();
            var removedItem = OnlineCourseSelectionVM.Where(item => item.SelectedCourse.event_id == eventId).FirstOrDefault();

            OnlineCourseSelectionVM.Remove(removedItem);
            _sessionService.SetListInSession("OnlineCourseSelectionVM", OnlineCourseSelectionVM, TimeSpan.FromMinutes(30));

            LoadData();
            return ViewComponent("SelectedCourse", this);
        }

The cshtml file

    <div id="OnlineCoursesRegContainer">
    @await Component.InvokeAsync("SelectedCourse", Model)
</div>




   function removeCourse(serial, eventId) {
        $("#selectedCoursesContainer").empty();
        // var eventId = $(this).data('event-id');

        var eventParams = {
            eventId: eventId,
        };

        $.ajax({
            type: "GET",
            url: "OnlineCourseRegistration?handler=RemoveItem&" + $.param(eventParams),

            success: function (result) {
                $("#selectedCoursesContainer").html(result);
                
            },
            error: function () {
                console.error("Error fetching data.");
            }
        });
    }

I don't see why I am getting the 500 response in my Ajax.