Hi I want to ask is there a way to submit validate and link to other page in BLAZOR
Thats how I link cancellation to other page
<NavLink href="@($"/personal/list/1")">
<button class="btn btn-primary" @onclick="CloseModal">@Loc["cancel"]</button>
</NavLink>
Thats my submmit button
<button type="submit" class="btn btn-success">@Loc["save"]</button>
Thats the Edit model for the button thats inside it
<EditForm Model="PersModel" OnValidSubmit="@CreatePersonal"> <FluentValidator TValidator="PersonalViewModelValidator" />
Thats the connection on Valid submmit to the API
protected async Task CreatePersonal()
{
var token = Storage["JWT-Token"];
bool personalExist = false;
Http.DefaultRequestHeaders.Authorization = new AuthenticationHeaderValue("Bearer", token);
//Convert Selected values into the Pers database values
PersModel.Pers.Group = PersModel.SelectedGruppe?.Name;
PersModel.Pers.Anrede = PersModel.SelectedAnredeName;
PersModel.Pers.Grad = PersModel.SelectedGradName;
PersModel.Pers.Titel = PersModel.SelectedTitelName;
PersModel.Pers.Department = PersModel.SelectedAbteilungName;
PersModel.Pers.Group = PersModel.SelectedGruppeName;
PersModel.Pers.PrevDepartment = PersModel.SelectedPrevAbteilungName;
PersModel.Pers.PrevGroup = PersModel.SelectedPrevGruppeName;
PersModel.Pers.Uni = PersModel.SelectedStaetteName;
//on input select after editing the --Select-- is converted into value
try
{
BoolValue uh = await Http.GetFromJsonAsync<BoolValue>(Storage["environment_uri"] + "/personal/exists/" + PersModel.Pers.PersName);
personalExist = uh.Value;
}
catch (Exception ex)
{
Logger.LogWarning(ex, "Failed to load BoolValue uh");
Storage.SetItem("Transaction", "errorload");
}
if (personalExist == false && PersModel.Pers.PersName != "_add_")
{
await Http.PostAsJsonAsync(Storage.GetItem("environment_uri") + "/personal", PersModel.Pers); // thats the one i add here
Storage.SetItem("Transaction", "modified");
await OnParametersSetAsync();
CloseModal();
}
else if (isEdit == true)
{
// here was post in original
await Http.PutAsJsonAsync(Storage.GetItem("environment_uri") + "/personal", PersModel.Pers); // this update
CloseModal();
Storage.SetItem("Transaction", "modified");
await OnParametersSetAsync();
}
else if (isEdit == false && personalExist == true)
{
Storage.SetItem("Transaction", "errorsame");
await OnParametersSetAsync();
}
}
Thats the Validation class
public PersonalViewModelValidator()
{
CascadeMode = CascadeMode.StopOnFirstFailure;
RuleFor(data => data.Pers.PersName).NotEmpty().WithMessage("is a required field.");
RuleFor(data => data.Pers.Bezeichnung).NotEmpty().WithMessage("is a required field.");
RuleFor(data => data.Pers.Id).NotEmpty().WithMessage("is a required field.");
RuleFor(data => data.Pers.Street).NotEmpty().WithMessage("is a required field.");
RuleFor(data => data.Pers.HouseNumber).NotEmpty().WithMessage("is a required field.");
RuleFor(data => data.Pers.PLZ).NotEmpty().WithMessage("is a required field.");
RuleFor(data => data.Pers.Location).NotEmpty().WithMessage("is a required field.");
RuleFor(data => data.Pers.DateHired).NotEmpty().WithMessage("is a required field.");
RuleFor(data => data.Pers.FullTime).NotEmpty().WithMessage("is a required field.");
RuleFor(data => data.Pers.Email).EmailAddress().WithMessage("A valid email address is required.");
//rule for the sieze max
RuleFor(data => data.Pers.Comment_1).Length(0,40).WithMessage("Must be less than 40 characters");
RuleFor(data => data.Pers.Comment_2).Length(0,40).WithMessage("Must be less than 40 characters");
// not working
RuleFor(data => data.SelectedAbteilungName).NotEmpty().WithMessage("is a required field.");
RuleFor(data => data.SelectedGruppeName).NotNull().WithMessage("is a required field.");
//RuleFor(data => data.SelectedAbteilung).NotEmpty().WithMessage("Abteilung is a required field.");
//RuleFor(data => data.SelectedGruppe).NotNull().WithMessage("Test test");
}
So what is to SUBMIT all this information get feedback if there is validation errors etc link to the another page and get the message from Toaster for example
NavLink href="@($"/personal/list/1")
@if (Storage.GetItem("Transaction") == "modified")
{
Toaster.Success(@TLoc["success1"], @TLoc["success2"]);
Storage.RemoveItem("Transaction");
}
Answers:
Thank you for visiting the Q&A section on Magenaut. Please note that all the answers may not help you solve the issue immediately. So please treat them as advisements. If you found the post helpful (or not), leave a comment & I’ll get back to you as soon as possible.
Method 1
I found a solution for it
[Inject]
public NavigationManager NavigationManager { get; set; }
protected void NavigateToOverview()
{
NavigationManager.NavigateTo("/personal/list/1");
}
and then you just call this method after the result from the API
NavigateToOverview();
in my case was
else if (isEdit == true)
{
// here was post in original
await Http.PutAsJsonAsync(Storage.GetItem("environment_uri") + "/personal", PersModel.Pers); // this update
CloseModal();
Storage.SetItem("Transaction", "modified");
await OnParametersSetAsync();
NavigateToOverview();
}
All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0