I use .net8 and blazor.
If I click on the checkbox from active to inactive, the value should become 0.
If I click on the checkbox from inactive to active, the default value should be shown immediately.
The user must also be able to change the value too, in the inputbox (InputNumber)
What am I doing wrong?
@foreach (var item in ViewModel.Items)
{
<CascadingValue Value="item">
<div class="row mt-3">
<div class="col-6">
@((MarkupString)@item.Omschrijving)
</div>
<div class="col-3">
<input class="checkbox-item mx-2"
id="@item.Id"
type="checkbox"
checked="@item.Actief"
@onchange="(e) => OnCheckboxChanged(item, e)" />
</div>
<div class="col-3">
<div class="form-group input-icon col-12">
<InputNumber @bind-Value="@item.VerzekerdeSom"
@onblur="Refresh" @key="item"
id="inputverzekerdesom"
class="form-control" FormatString="N0"
disabled="@(!item.Actief)" />
<i>€</i>
</div>
</div>
</div>
</CascadingValue>
}
@code
{
private void OnCheckboxChanged(AanvullendeDekkingenItem item, ChangeEventArgs e)
{
item.Actief = (bool)e.Value;
GetDekkingItem(item);
RenderKey++;
StateHasChanged();
}
private AanvullendeDekkingenItem GetDekkingItem(AanvullendeDekkingenModel model, int id)
{
var item = model.Items.Where(i => i.Id == id).First();
return GetDekkingItem(item);
}
private AanvullendeDekkingenItem GetDekkingItem(AanvullendeDekkingenItem item)
{
if (!item.Actief)
{
item.VerzekerdeSom = 0;
}
else if (item.VerzekerdeSom == 0)
{
item.VerzekerdeSom = item.StandaardSom;
}
return item;
}
protected void Refresh()
{
for (var id = 1; id < 6; id++)
{
GetDekkingItem(ViewModel, id);
}
StateHasChanged();
}
}