.net-coreasp.net-core-webapimauiblazor-webassembly

I can't do nested filtering on the page using .Net blazor


I am doing a full stack project using .NET Core and Blazor. I am trying to run Blazor in the web part but I am stuck at one point. When adding an exam, I want the exams to be listed in the box next to the selected course and I want the question in the selected exam to be recorded there.

My area of interest in Blazor page is as follows

<EditForm Model="_quiz" OnValidSubmit="SaveQuizAsync">
<DataAnnotationsValidator />
<div class="row">
    <div class="col-sm-3">
        <div class="mb-3">
            <label class="form-label">Dersler</label>
            <InputSelect @bind-Value="_quiz.LessonId" class="form-control" @onchange="LoadExamsAsync">
                <option value="0">Ders Seç</option>
                @foreach (var c in _lessonDtos)
                {
                    <option value="@c.Id">@c.Name</option>
                }
            </InputSelect>
            <ValidationMessage For="@(() => _quiz.LessonId)" />
        </div>
    </div>
    <div class="col-sm-3">
        <div class="mb-3">
            <label class="form-label">Exams</label>
            <InputSelect @bind-Value="_quiz.ExamId" class="form-control">
                @if (_examDtos.Any())
                {
                    <option value="0">Exam Seç</option>
                    @foreach (var e in _examDtos)
                    {
                        <option value="@e.Id">@e.Name</option>
                    }
                }
                else
                {
                    <option value="0">Bu derse ait sınav bulunamadı</option>
                }
            </InputSelect>
            <ValidationMessage For="@(() => _quiz.ExamId)" />
        </div>

My SaveQuizAsync method looks like this:

private async Task SaveQuizAsync()
{
    var errorMessage = _quiz.TryValidate();

    if (!string.IsNullOrWhiteSpace(errorMessage))
    {
        await ShowAlertAsync(errorMessage);
        return;
    }

    var response = await QuizApi.CreateQuizzesAsync(_quiz);

    if (!response.IsSuccess)
    {
        await ShowAlertAsync(response.ErrorMessage);
        return;
    }

    NavigationManager.NavigateTo("/admin/manage-quizzes");
}

The method I created to list the relevant exams is as follows

private async Task LoadExamsAsync(ChangeEventArgs e)
{
    Console.WriteLine("LoadExamsAsync triggered"); // Bu satır tetikleniyor mu kontrol edin

    if (Guid.TryParse(e.Value?.ToString(), out var lessonId))
    {
        Console.WriteLine($"Selected LessonId: {lessonId}");
        _examDtos = (await ExamApi.GetExamsByLessonId(lessonId))?.ToArray() ?? Array.Empty<ExamDto>();
        StateHasChanged(); // Sayfayı güncellemek için
    }
    else
    {
        Console.WriteLine("Invalid LessonId");
    }
}

On the backend side, I share my related codes as ordinary as below

The field where I call the related method on the API side

[HttpGet("{lessonId:guid}")]
public async Task<IActionResult> GetExamsByLessonId(Guid lessonId, bool trackChanges)
{
    try
    {
        // İlgili derse ait sınavları alıyoruz
        var exams = await _manager.ExamService.GetExamsByLessonIdAsync(lessonId, trackChanges);

        // Eğer sınav bulunamadıysa, uygun bir mesaj döndürüyoruz
        if (!exams.Any())
        {
            return NotFound($"No exams found for the lesson with ID {lessonId}");
        }

        // Sınavları başarıyla bulduysak, onları döndürüyoruz
        return Ok(exams);
    }
    catch (Exception ex)
    {
        // Hata durumunda uygun mesaj dönüyoruz
        return BadRequest($"An error occurred while fetching exams: {ex.Message}");
    }
}

The relevant method in the service layer of the call I use in the controller is as follows

 public async Task<IEnumerable<ExamDto>> GetExamsByLessonIdAsync(Guid lessonId, bool trackChanges)
{
    // Repository'den sınavları alıyoruz
    var exams = await _manager.Exam.GetExamByLessonIdAsync(lessonId, trackChanges);

    // Eğer sınavlar yoksa, boş bir liste döndürüyoruz
    if (!exams.Any())
    {
        return new List<ExamDto>();
    }

    // Sınavları DTO'ya dönüştürüyoruz
    var examDtos = exams.Select(e => new ExamDto
    {
        Id = e.Id,
        Name = e.Name,
        LessonId = e.LessonId, // LessonId'yi alıyoruz
        LessonName = e.Lesson.Name
       
    });

    return examDtos;
}

image added!

What I want to do is to list the exams of that course in the exams box on the side when the course is selected and add the question to that exams

I tried to write all the things that came to my mind, it was a little long, but I tried to make it understandable.


Solution

  • If you use Apple System, there's a networking feature called App Transport Security (ATS) which may block connections that fail to meet minimum security specifications.

    As a workaround, you may add the NSAppTransportSecurity key to your app’s Info.plist and providing an ATS configuration dictionary as the value. You may try adding the following key&value to your Info.plist,

    <dict>    
      <key>NSAllowsArbitraryLoads</key>
      <true/>
    </dict>
    

    For more info, please refer to NSAppTransportSecurity.