When I fill in the following form located in Pages/AddCustomer.razor, the values are cleared when I click "save" and the above error messages are displayed from Customer.cs.
I have created a test Blazor app to understand passing values from a HTML form to a SQL Server database and to learn how to perform CRUD operations.
The database table and columns I am working with is:
SELECT [CustomerId], [Name], [Email], [Phone], [Address]FROM [Test].[dbo].[Customers]Inside the Blazor app, I have created a model class called Customer with the following code:
// Models/Customer.csusing System.ComponentModel.DataAnnotations;namespace BlazorApp2.Models // Replace with your actual namespace{ public class Customer { [Key] public int CustomerId { get; set; } [Required(ErrorMessage = "Name is required.")] public string Name { get; set; } [EmailAddress(ErrorMessage = "Invalid email address.")] public string Email { get; set; } [Required(ErrorMessage = "Phone number is required.")] public string Phone { get; set; } [Required(ErrorMessage = "Address is required.")] public string Address { get; set; } }}I have tried adding a breakpoint to
dbContext.Customers.Add(newCustomer) but it does not appear to be reaching this far. I was wondering if it was to do with the OnInitialized.
Sorry if this is something really simple as i have just started to learn Blazor.
@page "/customers/add"@using BlazorApp2.Data@using BlazorApp2.Models@inject AppDbContext dbContext@inject NavigationManager NavigationManager<PageTitle>Add New Customer</PageTitle><h3>Add New Customer</h3><EditForm Model="@newCustomer" FormName="addCustomerForm" OnValidSubmit="@HandleValidSubmit"><DataAnnotationsValidator /><ValidationSummary /><div class="mb-3"><label for="name" class="form-label">Name</label><InputText id="name" class="form-control" @bind-Value="newCustomer.Name" /><ValidationMessage For="@(() => newCustomer.Name)" /></div><div class="mb-3"><label for="email" class="form-label">Email</label><InputText id="email" class="form-control" @bind-Value="newCustomer.Email" /><ValidationMessage For="@(() => newCustomer.Email)" /></div><div class="mb-3"><label for="phone" class="form-label">Phone</label><InputText id="phone" class="form-control" @bind-Value="newCustomer.Phone" /><ValidationMessage For="@(() => newCustomer.Phone)" /></div><div class="mb-3"><label for="address" class="form-label">Address</label><InputText id="address" class="form-control" @bind-Value="newCustomer.Address" /><ValidationMessage For="@(() => newCustomer.Address)" /></div><button type="submit" class="btn btn-primary">Save</button><a href="/customers" class="btn btn-secondary">Cancel</a></EditForm>@code { private Customer newCustomer = new Customer(); protected override void OnInitialized() { // Display initial values when the component is initialized Console.WriteLine("Initial values of newCustomer:"); Console.WriteLine($" Name: {newCustomer.Name}"); Console.WriteLine($" Email: {newCustomer.Email}"); Console.WriteLine($" Phone: {newCustomer.Phone}"); Console.WriteLine($" Address: {newCustomer.Address}"); } private async Task HandleValidSubmit() { Console.WriteLine("Values of newCustomer before saving:"); Console.WriteLine($" Name: {newCustomer.Name}"); Console.WriteLine($" Email: {newCustomer.Email}"); Console.WriteLine($" Phone: {newCustomer.Phone}"); Console.WriteLine($" Address: {newCustomer.Address}"); dbContext.Customers.Add(newCustomer); await dbContext.SaveChangesAsync(); NavigationManager.NavigateTo("/customers"); Console.WriteLine("Values of newCustomer after saving (should be default again):"); Console.WriteLine($" Name: {newCustomer.Name}"); Console.WriteLine($" Email: {newCustomer.Email}"); Console.WriteLine($" Phone: {newCustomer.Phone}"); Console.WriteLine($" Address: {newCustomer.Address}"); }}