Validation doesn't work in a Dialog (Server-side)

Hi all,

Before creating a new topic, I searched thoroughly but didn't find anything that answered the question.

I've created a simple dialog, but the validation doesn't work. I tried debugging OnSubmit and if (radzenTemplateForm.EditContext.Validate()) returns true. But the required fields are empty :frowning: What could be wrong?

@page "/CreateAkbankPayment"
@using DTCSupport.Services.Payments

@inject IPaymentsService PaymentsService
@inject DialogService DialogService

<RadzenTemplateForm TItem="AkbankTransaction" Data=@_model Submit=@OnSubmit>
    <div class="row">
        <div class="row">
            <div class="col-4">
                <div class="mb-3">
                    <RadzenLabel Text="Amount" Component="Amount"/>
                </div>
            </div>
            <div class="col-8">
                <div class="mb-3">
                    <RadzenNumeric Name="Amount" @bind-value="@_model.Amount" TValue="decimal" Format="0.00" ShowUpDown="false" class="w-100"/>
                    <RadzenRequiredValidator Component="Amount" Text="Amount is required"/>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-4">
                <div class="mb-3">
                    <RadzenLabel Text="Description" Component="Description"/>
                </div>
            </div>
            <div class="col-8">
                <div class="mb-3">
                    <RadzenTextBox Name="Description" @bind-value="@_model.Description" class="w-100"/>
                    <RadzenRequiredValidator Component="Description" Text="Description is required"/>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-4">
                <div class="mb-3">
                    <RadzenLabel Text="Sender Iban" Component="SenderIban"/>
                </div>
            </div>
            <div class="col-8">
                <div class="mb-3">
                    <RadzenTextBox Name="SenderIban" @bind-value="@_model.SenderIban" class="w-100"/>
                    <RadzenRequiredValidator Component="SenderIban" Text="SenderIban is required"/>
                </div>
            </div>
        </div>
    </div>
    <div class="row justify-content-center">
        <div class="col-auto px-sm-1">
            <RadzenButton Text="Create" ButtonType="ButtonType.Submit"/>
        </div>
        <div class="col-auto px-sm-1">
            <RadzenButton Text="Cancel" ButtonType="ButtonType.Reset" ButtonStyle="ButtonStyle.Secondary" Click="@(_ => DialogService.Close(false))"/>
        </div>
    </div>
</RadzenTemplateForm>

@code {

    private readonly AkbankTransaction _model = new() {
        Amount = 20,
        SenderIban = "TR000000000000000000000001"
    };

    private async Task OnSubmit(AkbankTransaction model)
    {
        await PaymentsService.Create(model);
        DialogService.Close(true);
    }
}

Hi @ISkomorokh,

This should be @bind-Value="@_model.Description".

1 Like

@korchev thank you very much for your help! You saved me.
I'm new to Blazor, so didn't spot that.

No worries! I understand your confusion. The Radzen.Blazor components support custom attributes (so one can set arbitrary html attributes such as class, style etc.). However this allows setting invalid stuff such as @bind-value.

1 Like