Input password Blazor forms

Question

I am adding a form in Blazor and I am following instructions as specified here

https://learn.microsoft.com/en-us/aspnet/core/blazor/forms-validation?view=aspnetcore-3.0

Is it possible to add an input with mask for passwords.

I tried adding doing something like

public class LoginModel
    {
        [Required]
        public string Username { get; set; }

        [Required]
        [DataType(DataType.Password)]
        public string Password { get; set; }
    }

but that didnt work. Is there a way to hide password when inserted in input?

Answer 1

You can use the InputText component with type=password:

<EditForm Model="@model">
    <DataAnnotationsValidator />
    <ValidationSummary />
    <InputText type="password" placeholder="Password" @bind-Value="@model.Password" />
</EditForm>

@code {
    class Login
    {
        [Required]
        public string Password { get; set; }
    }

    private Login model = new Login();
}

The InputText support all <input /> attributes