Mejora de accesibilidad en Blazor con .NET 5

Mteheran's Blog

Una mejora bastante interesante en términos de accesibilidad fue incluida en Blazor con .NET.

Blazor tiene la posibilidad de crear formularios y realizar validaciones fácilmente utilizando ya sea los atributos de validación o creando una condición personalizada en C#.

En el siguiente ejemplo podemos observar un componente con un formulario donde existe una regla para el campo del formulario name por un máximo de 10 caracteres:

@page "/"
@using System.ComponentModel.DataAnnotations
   
<EditForm Model="@exampleModel" OnValidSubmit="@HandleValidSubmit">
     <DataAnnotationsValidator />
    <ValidationSummary />
    <InputText id="name" @bind-Value="exampleModel.Name" ></InputText>
     <button type="submit">Submit</button>
</EditForm>

@code
{
    private ExampleModel exampleModel = new ExampleModel();

    private void HandleValidSubmit()
    {

    }

    public class ExampleModel
    {
        [Required]
        [StringLength(10, ErrorMessage = "Name is too long.")]
        public string Name { get; set; }
    }
}

La mejora consiste en que cuando falle la validación y no se cumpla entonces automáticamente no solo muestra un error sino que también agrega el atributo aria-invalid indicando que este campo tiene…

View original post 3 more words

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.