Using AspNet Blazor and its EditForm: I am creating a simple form that should contain both an update and a delete button. I do not seem to find any examples of how to pass parameters to the submit.
I have tried to place an @onclick in the delete button pointing towards DeleteObject, but then I get no validation (I actually do not need validation in this case, but I want to do it anyway), plus that the SaveObject was also called after the delete...
<EditForm Model="@selectedCar" OnValidSubmit="@SaveObject">
<DataAnnotationsValidator />
<ValidationSummary />
....My <InputText>'s for all values I have in my object
<button type="submit" class="btn btn-primary" value="Save">Spara</button>
<button type="submit" class="btn btn-primary" value="Delete">Delete</button>
</EditForm>
@code {
[Parameter]
public string Id { get; set; }
CarModel selectedCar;
protected override async Task OnInitializedAsync()
{
selectedCar = await _CarService.GetCar(int.Parse(Id));
}
protected async Task SaveObject()
{
selectedCar.Id = await _CarService.SaveCar(selectedCar);
}
protected async Task DeleteObject(int Id)
{
selectedCar.Id = await _CarService.DeleteCar(selectedCar);
}
}
I want to be able to call specific functions for each button, without going around validation.
Anyone have a good idea how to do this?
Ok, I ended up with the following solution. It seems to work as expected.
<EditForm Model="@selectedCar" Context="formContext">
<DataAnnotationsValidator />
<ValidationSummary />
....My <InputText>'s for all values I have in my object
<button type="submit" class="btn btn-primary" @onclick="@(() => SaveCar(formContext))">Save</button>
<button type="submit" class="btn btn-primary" @onclick="@(() => UpdateStockQuantity(formContext))">Update stock quantity</button>
<button type="submit" class="btn btn-secondary" @onclick="@(() => DeleteCar(formContext))">Delete</button>
</EditForm>
@code {
[Parameter]
public string Id { get; set; }
CarModel selectedCar;
protected override async Task OnInitializedAsync()
{
selectedCar = await _CarService.GetCar(int.Parse(Id));
}
protected async Task SaveCar(EditContext formContext)
{
bool formIsValid = formContext.Validate();
if (formIsValid == false)
return;
selectedCar.Id = await _CarService.SaveCar(selectedCar);
}
... plus same approach with UpdateStockQuantity and DeleteCar.
}
The two buttons will submit the form with the validations.
And then you can check on the Boolean and call any logic you want:
<EditForm Model="@Input" OnValidSubmit="@UpdateAsync">
<DataAnnotationsValidator />
<div class="row">
<div class="form-group col-md-12">
<label class="required"> Name</label>
<InputText class="form-control" @bind-Value="Input.Name" />
<span class="err"><ValidationMessage For="@(() => Input.Name)" /></span>
</div>
</div>
<div class="text-center">
<button type="submit" @onclick="@(()=> Input.IsNew = false)" class="btn">save 1</button>
<button type="submit" @onclick="@(()=> Input.IsNew = true)" class="btn">save 2</button>
</div>
</EditForm>
@code{
async Task UpdateAsync()
{
if (Input.IsNew)
{
//do somthing
}
else
{
//do another somthing
}
}
}
If you use type="button"
then only the @onclick
method is called and not the OnValidSubmit
method. But this way there's no validation.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With