I have this blazorform, the only button that works is the submit/save button.
As you can see, I have tried with some variants of the Add phone button, but none of the buttons calls their associated methods, -except the submit button.
Otherwise the page works as expected, I'm completely stumped. There is nothing to see in the console.
@page "/editaddress/{id?}"@using addressbook.Models@using Microsoft.IdentityModel.Tokens@inject HttpClient Http@inject NavigationManager NavigationManager<h3>@(isEdit ? "Edit Address" : "Add Address")</h3><EditForm Model="_newAddress" OnValidSubmit="HandleValidSubmit" FormName="EditPerson"><DataAnnotationsValidator /><ValidationSummary /><label>First Name:</label><InputText @bind-Value="_newAddress.FirstName" /><br /><label>Last Name:</label><InputText @bind-Value="_newAddress.LastName" /><br /><label>Birthday:</label><InputDate @bind-Value="_newAddress.Birthday" /><br /><label>Emails:</label> @if (_newAddress.Emails == null || !_newAddress.Emails.Any()) {<p>No emails added. <button type="button" @onclick="AddEmail">Add Email</button></p> } else { @foreach (var email in _newAddress.Emails) {<div><InputText @bind-Value="email.Value" placeholder="Email Address" /><InputText @bind-Value="email.Label" placeholder="Label (e.g., Work, Personal)" /><button type="button" @onclick="() => RemoveEmail(email)">Remove</button></div> }<button type="button" @onclick="AddEmail">Add Email</button> }<br /><label>Phones:</label> @if (_newAddress.Phones == null || !_newAddress.Phones.Any()) {<p>No phones added. <button type="button" @onclick="@(() => AddPhone())">Add Phone</button></p> } else { @foreach (var phone in _newAddress.Phones) {<div><InputText @bind-Value="phone.Value" placeholder="Phone Number" /><InputText @bind-Value="phone.Label" placeholder="Label (e.g., Mobile, Home)" /><button type="button" @onclick="@(() => RemovePhone(phone))">Remove</button></div> }<button type="button" @onclick="@(() => AddPhone())" >Add Phone0</button><button type="button" @onclick="AddPhone">Add Phone1</button><button type="button" @onclick="() => AddPhone()">Add Phone2</button> }<br /><button type="submit">Save</button></EditForm>@code { [Parameter] public string id { get; set; } private NewAddress _newAddress = new NewAddress(); private bool isEdit; protected override async Task OnInitializedAsync() { if (!id.IsNullOrEmpty()) { isEdit = true; string uri = $"/api/Address/{id}"; _newAddress = await Http.GetFromJsonAsync<NewAddress>(uri); } } private async Task HandleValidSubmit() { if (isEdit) { await Http.PutAsJsonAsync($"api/Address/{id}", _newAddress); } else { await Http.PostAsJsonAsync("api/Address", _newAddress); } NavigationManager.NavigateTo("/addresses"); } private void AddEmail() { _newAddress.Emails.Add(new Email("", "")); } private void RemoveEmail(Email email) { _newAddress.Emails.Remove(email); } private void AddPhone() { _newAddress.Phones.Add(new Phone("", "")); } private void RemovePhone(Phone phone) { _newAddress.Phones.Remove(phone); }}