C
C#6mo ago
hunterlan

Unable to set property 'onsubmit' on object of type

Hi everyone! I created a simple login page but it throws me an exception:
InvalidOperationException: Unable to set property 'onsubmit' on object of type 'Microsoft.AspNetCore.Components.Forms.EditForm'. The error was: Unable to cast object of type 'Microsoft.AspNetCore.Components.EventCallback`1[System.EventArgs]' to type 'Microsoft.AspNetCore.Components.EventCallback`1[Microsoft.AspNetCore.Components.Forms.EditContext]'.
InvalidOperationException: Unable to set property 'onsubmit' on object of type 'Microsoft.AspNetCore.Components.Forms.EditForm'. The error was: Unable to cast object of type 'Microsoft.AspNetCore.Components.EventCallback`1[System.EventArgs]' to type 'Microsoft.AspNetCore.Components.EventCallback`1[Microsoft.AspNetCore.Components.Forms.EditContext]'.
Here's my blazor page:
@page "/Login"
@using System.Text.Json
@using System.Net
@using Novel.Blazor.Models
@inject HttpClient HttpClient
@inject ProtectedSessionStorage ProtectedSessionStore
<h3>Login</h3>
@rendermode InteractiveServer

<div>
<EditForm method="post" Model="@LoginUser" @onsubmit="@Submit">
<InputText type="email" @bind-Value="LoginUser.Email"></InputText>
<InputText type="password" @bind-Value="LoginUser.Password"></InputText>
<button type="submit">Login</button>
</EditForm>
</div>

@code {
[SupplyParameterFromForm]
private LoginUser? LoginUser { get; set; }

protected override void OnInitialized() => LoginUser ??= new LoginUser();
[Inject] ModalService ModalService { get; set; } = default!;
private async Task Submit()
{
var serialized = JsonSerializer.Serialize(LoginUser);

var result = await HttpClient.PostAsJsonAsync($"api/User", serialized).ConfigureAwait(true);
if (result.IsSuccessStatusCode)
{
await using var responseStream = await result.Content.ReadAsStreamAsync();
var token = await JsonSerializer.DeserializeAsync
<TokenDto>(responseStream);
await ProtectedSessionStore.SetAsync("token", token!.Token);
}
else
{
if (result.StatusCode == HttpStatusCode.Unauthorized)
{
await ShowError("Email or/and password are incorrect!");
}
else
{
await ShowError("Something went wrong");
}
}
}

private async Task ShowError(string message)
{
var modalOption = new ModalOption
{
Title = "Modal title",
Message = message,
Type = ModalType.Danger,
Size = ModalSize.Regular
};

await ModalService.ShowAsync(modalOption);
}

}
@page "/Login"
@using System.Text.Json
@using System.Net
@using Novel.Blazor.Models
@inject HttpClient HttpClient
@inject ProtectedSessionStorage ProtectedSessionStore
<h3>Login</h3>
@rendermode InteractiveServer

<div>
<EditForm method="post" Model="@LoginUser" @onsubmit="@Submit">
<InputText type="email" @bind-Value="LoginUser.Email"></InputText>
<InputText type="password" @bind-Value="LoginUser.Password"></InputText>
<button type="submit">Login</button>
</EditForm>
</div>

@code {
[SupplyParameterFromForm]
private LoginUser? LoginUser { get; set; }

protected override void OnInitialized() => LoginUser ??= new LoginUser();
[Inject] ModalService ModalService { get; set; } = default!;
private async Task Submit()
{
var serialized = JsonSerializer.Serialize(LoginUser);

var result = await HttpClient.PostAsJsonAsync($"api/User", serialized).ConfigureAwait(true);
if (result.IsSuccessStatusCode)
{
await using var responseStream = await result.Content.ReadAsStreamAsync();
var token = await JsonSerializer.DeserializeAsync
<TokenDto>(responseStream);
await ProtectedSessionStore.SetAsync("token", token!.Token);
}
else
{
if (result.StatusCode == HttpStatusCode.Unauthorized)
{
await ShowError("Email or/and password are incorrect!");
}
else
{
await ShowError("Something went wrong");
}
}
}

private async Task ShowError(string message)
{
var modalOption = new ModalOption
{
Title = "Modal title",
Message = message,
Type = ModalType.Danger,
Size = ModalSize.Regular
};

await ModalService.ShowAsync(modalOption);
}

}
Here's LoginUser class:
public class LoginUser
{
public string Email { get; set; }

public string Password { get; set; }
};
public class LoginUser
{
public string Email { get; set; }

public string Password { get; set; }
};
What am I doing wrong?
4 Replies
Angius
Angius6mo ago
Try OnSubmit OnSubmit="@Submit"
hunterlan
hunterlan6mo ago
Nice, it's fixed, but. Why does it matter?
Angius
Angius6mo ago
1. C# is case-sensitive 2. @ is for executing C# code, you don't add it before attribute names
hunterlan
hunterlan6mo ago
got it, thanks!
Want results from more Discord servers?
Add your server
More Posts