Megabit / Blazorise

Blazorise is a component library built on top of Blazor with support for CSS frameworks like Bootstrap, Tailwind, Bulma, AntDesign, and Material.
https://blazorise.com/
Other
3.26k stars 528 forks source link

[Bug]: Validation on InputMask is not kicking off and binds the input mask #5180

Open sturlath opened 9 months ago

sturlath commented 9 months ago

Blazorise Version

1.3.2

What Blazorise provider are you running on?

Bootstrap5

Link to minimal reproduction, or a simple code snippet

I might be doing this wrong but I have this code

<Fields>
    <Validation MessageLocalizer="@Localize">
        <Field ColumnSize="ColumnSize.Is3.OnDesktop.Is3.OnWidescreen">
            <FieldBody>
                <FieldLabel>@L["Kennitala"]</FieldLabel>
                <InputMask Mask="999999-9999" @bind-Value="@BankInformation.Kennitala" >
                     <Feedback>
                        <ValidationError />
                    </Feedback>
             </InputMask>       
            </FieldBody>
        </Field>
    </Validation>
</Fields>

with

  [Required(ErrorMessage = "Required")]
  [StringLength(11, ErrorMessage = "Mustbebetween10and11characters", MinimumLength = 10)]
  public string Kennitala { get; set; }

but only the Required part is validated but not the MinimumLength one

image

and what happens is that this value gets safed 3_-

Steps to reproduce

see above

What is expected?

The validation should kick off and not allow the mask value to be bound.

What is actually happening?

Only one value is enough to get past the validation and bind to the inputmask...

What browsers are you seeing the problem on?

Microsoft Edge

Any additional comments?

No response

stsrki commented 8 months ago

I suspect that the Value of the InputMask always has _ as part of the mask value. So the final Value will always have 11 characters which can be considered a valid value.

Can you try setting the AutoUnmask="true" so that the _ are stripped away?

sturlath commented 8 months ago

That didn´t solve it

image