basically I have 2 blazor components , the child (NewChecklist.razor) is a form that takes input values as parameters that are passed in its parent component (ChecklistManagement.razor). I realized the values werent being recognized in the parent component because when I would try to submit a new Checklist , it was basically an empty list where all the values were missing. At this point I am simply trying to log the value of the first input to the console, and even that I am struggling with
Child Component (NewChecklist.razor) :
@using SFSCheckList.Data.Repos<h3>NewChecklist</h3><p>kahdjakhflkajfke</p><form @onsubmit="AddCheckList"><div><input @bind-value="Name" label="Title" Style="width: 25rem"></input></div><div><FluentTextField @bind-Value="Description" label="Description" Style="width: 25rem"></FluentTextField></div><p></p><div style="display: flex"><div style="display: flex; flex-direction: column;"><label>Start Date</label><FluentDatePicker Value="@(StartDate)" ValueChanged="@(e => StartDate = e.Value)" /></div><div style="display: flex; flex-direction: column;"><label>End Date</label><FluentDatePicker Value="@EndDate" ValueChanged="@(e => EndDate = e.Value)" Style="margin-left: 5px;" /></div></div><button>Submit</button></form>@code { [Inject] protected ChecklistRepo? checklistRepo { get; set; } [Parameter] public string Name { get; set; } = string.Empty; [Parameter] public string Description { get; set; } = string.Empty; [Parameter] public DateTime StartDate { get; set; } = DateTime.Now; [Parameter] public DateTime EndDate { get; set; } = DateTime.Now; [Parameter] public EventCallback AddCheckList { get; set; } // private async Task SubmitChecklist() // { // Console.WriteLine(Name); // Console.WriteLine(Description); // // You can perform further operations like adding the checklist to the database here // await AddCheckList.InvokeAsync(); // }}Parent Component (ChecklistManagement.razor) :
@page "/ManageChecklists"@using SFSCheckList.Data.Repos@using SFSCheckList.Components.Checklists<h3>Checklist Management</h3><div style="display: flex;"><div style="border: 1px solid black; border-radius: 5px; padding: 1rem; background: #F1F3F9; min-height: 30rem; min-width: 25rem;"><CheckListList Checklists="@Checklists" OnChecklistSelected="HandleChecklistSelected" isAddingEnabled="isAddingEnabled" EnableAddChecklist="EnableAddChecklist"/></div><div style="margin-left: 3rem;border: 1px solid black; border-radius: 5px; padding: 1rem; background: #F1F3F9; min-height: 30rem; min-width: 25rem;"> @if (isAddingEnabled) {<NewChecklist Name="@ChecklistName" Description="@ChecklistDescription" StartDate="@AvailableStartDate" EndDate="@AvailableEndDate" AddCheckList="SubmitChecklist"/> } else {<ChecklistDetails Checklist="SelectedChecklist" EnableEditChecklist="EnableEditChecklist" isEditingEnabled="isEditingEnabled" /> }</div></div>@code { [Inject] protected ChecklistRepo? checklistRepo { get; set; } public bool isAddingEnabled { get; set; } = false; public bool isEditingEnabled { get; set; } = false; public string ChecklistName { get; set; } = string.Empty; public string ChecklistDescription { get; set; } = string.Empty; public DateTime AvailableStartDate { get; set; } = DateTime.Now; public DateTime AvailableEndDate { get; set; } = DateTime.Now; public SFSCheckList.Data.Models.Checklist? SelectedChecklist { get; set; } List<SFSCheckList.Data.Models.Checklist> Checklists = new List<SFSCheckList.Data.Models.Checklist>(); //enable edit functionality public void EnableEditChecklist() { Console.WriteLine("Edit Checklist"); isEditingEnabled = !isEditingEnabled; } public void EnableAddChecklist() { Console.WriteLine("Adding Checklist"); isAddingEnabled = !isAddingEnabled; } // method to submit checklist async Task SubmitChecklist() { // var newChecklist = new SFSCheckList.Data.Models.Checklist() // { // ChecklistName = ChecklistName, // ChecklistDescription = ChecklistDescription, // AvailableStartDate = AvailableStartDate, // AvailableEndDate = AvailableEndDate, // FY = "2024", // LCTS = DateTime.Now // }; // await checklistRepo.UpsertChecklist(newChecklist); // Checklists.Add(newChecklist); // StateHasChanged(); Console.WriteLine("the Checklist name is " + ChecklistName); } // method to get checklists async Task GetChecklists() { Checklists = await checklistRepo.GetChecklists(); var checklists = await checklistRepo.GetChecklists(); foreach (var checklist in checklists) { Console.WriteLine(checklist.ChecklistName); } } protected override async Task OnInitializedAsync() { await base.OnInitializedAsync(); await GetChecklists(); } // method to handle checklist selected private void HandleChecklistSelected(SFSCheckList.Data.Models.Checklist checklist) { SelectedChecklist = checklist; Console.WriteLine($"Checklist Selected:"); Console.WriteLine($"Name: {checklist.ChecklistName}"); StateHasChanged(); }}i have tried to access those values in many failed attempts , the ultimate goal is to be able to get all the values from the form (ChecklistName, ChecklistDescription etc) and successfully create a new checklist, as of right now though , im just trying to access the values in a console.writeline statement to make sure its working