Validator is not triggering

Hi, all

I was confused why the validator did not trigger. I send my screenshot below.

image

<form method="post" action="account/login">
<RadzenContent Container="main">
  <ChildContent>
    <RadzenProgressBar Mode="ProgressBarMode.Indeterminate" Visible="false">
    </RadzenProgressBar>
    <RadzenHeading Size="H1" Text="Login">
    </RadzenHeading>
    <RadzenTemplateForm Action="/Account/Login" Method="post" TItem="dynamic">
      <ChildContent>
        <div class="row align-items-center justify-content-center" style="padding-bottom: 16px">
          <div class="col-md-12">
            <div class="row">
              <div class="col-md-3">
                <RadzenLabel Component="Username" style="display: block" Text="Email">
                </RadzenLabel>
              </div>
              <div class="col-md-9">
                <RadzenTextBox style="display: block; width: 100%" Name="Username">
                </RadzenTextBox>
                <RadzenRequiredValidator Component="Username" Popup="true" Text="Email is required">
                </RadzenRequiredValidator>
                <RadzenEmailValidator Component="Username" Popup="true" Text="Invalid email">
                </RadzenEmailValidator>
              </div>
            </div>
            <div style="margin-top: 48px" class="row">
              <div class="col-md-3">
                <RadzenLabel Component="Password" style="display: block" Text="Password">
                </RadzenLabel>
              </div>
              <div class="col-md-9">
                <RadzenPassword style="display: block; width: 100%" Name="Password">
                </RadzenPassword>
                <RadzenRequiredValidator Component="Password" Popup="true" Text="Password is required">
                </RadzenRequiredValidator>
                <RadzenLengthValidator Component="Password" Min="8" Popup="true" Text="Invalid password">
                </RadzenLengthValidator>
              </div>
            </div>
            <div style="margin-top: 48px" class="row">
              <div class="col-md-6 offset-md-3">
                <RadzenButton ButtonType="ButtonType.Submit" style="width: 100%" Text="Login">
                </RadzenButton>
              </div>
            </div>
          </div>
        </div>
      </ChildContent>
    </RadzenTemplateForm>
  </ChildContent>
</RadzenContent>
</form>

It was execute submit action directly no matter if pass by validator or not.

If anyone has suggestion, please help with me.

Hi @cspangge,

Blazor validation does not work with forms that have their action attribute set. Form submission happens regardless of Blazor validation result.

The way the registration dialog is currently implemented (using the Radzen "Default" security provider) is not very useful.
I think it is very frustrating for the users if they are redirected back to the login page every time they make a wrong entry on the registration dialog (missing required fields, wrong password scheme, wrong password confirmation, etc.).

Does anyone know a workaround without linking some javascript library (e.g. jquery-validation)?