Inicio
PERENDERnew
Tema
Form
Componentes básicos
Visor de PDF
chartsnew
Instalación
line
Explorador de archivos
Texto enriquecido
Form
InputPassword
InputPassword

1. Demo AstrolInputPassword usando EditForm

Nota:
En este ejemplo se implementan notificaciones, botones, label y content input, por lo que se recomienda ver la documentación de los mismos.
@using Astrol.Component.Basic.Button
@using Astrol.Component.Basic.Form
@using System.ComponentModel.DataAnnotations
@using Astrol.Entities.Basic.Static.Notification
@using Astrol.Entities.Basic.UI
@using Astrol.JSInterop.Base
@inject AstrolJSInterop jsI
 
<EditForm Model="@login" OnValidSubmit="@HandleValidSubmit">
 <DataAnnotationsValidator />
 <div class="form-control-file">
 <AstrolLabel TItem="Login" For="@nameof(login.Password)" />
 <AstrolContentInput>
 <AstrolInputPassword @bind-Value="@login.Password" Id="@nameof(login.Password)" Class="form-control"/>
 </AstrolContentInput>
 <ValidationMessage For="@(() => login.Password)" />
 </div>
 <AstrolButton Type="ButtonType.Submit" Text="Send" Style="AstrolStyle.Blue" Class="fr" />
</EditForm>
@code {
 public class Login { 
 [Display(Name = "Password")]
 [Required(ErrorMessage = "Password required.")]
 [MinLength(6, ErrorMessage = "Minimum length of 6 characters.")]
 public string Password { get; set; }
 }
 private Login login = new Login();
 private async Task HandleValidSubmit() {
 await jsI.Notification("Sending form".NotificationSucces());
 }
}

Parámetros que admite

  • Class (string), clase css personalizada que desee establecer.
  • Id (string), etiqeuta id que desee establecer.
  • Placeholder (string), texto placeholder a mostrar si desea.
  • ShowPassword (bool), permite establecer si desea que el componente ocultar o mostrar la contraseña (por defecto es true).
  • Autocomplete (bool), permite establecer si desea permitir el auto completamiento del navegador (por defecto es true).
© 2025 AstrolUI v8.0.4
Se ha producido un error no controlado. Recargar 🗙