Get Even More Visitors To Your Blog, Upgrade To A Business Listing >>

Personalizar los mensajes de error de parseado en formularios Blazor

Como sabemos, gran parte de las validaciones en formularios Blazor las implementamos usando anotaciones de datos, o data annotations. Estas anotaciones nos permiten validar los datos de entrada antes de que ejecutemos la lógica de negocio, que normalmente se encontrará en el handler del evento OnValidSubmit del formulario.

Vemos un ejemplo de formulario Blazor aquí, y el código C# justo debajo:

@page "/friend"

FriendEditor

@code {
    private FriendViewModel Friend = new();

    private async Task Save()
    {
        await Task.Delay(1000);
        Friend = new FriendViewModel();
    }

    public class FriendViewModel
    {
        [Required(ErrorMessage = "El nombre es obligatorio")]
        public string Name { get; set; }
        [Range(0, 10, ErrorMessage = "La puntuación debe estar entre {1} y {2}")]
        public int Score { get; set; }
        public DateTime BirthDate { get; set; }
    }
}

En tiempo de ejecución, cuando introducimos valores inválidos (por ejemplo, si dejamos en blanco el nombre o introducimos en Score un número fuera del rango 0-10 permitido), podremos ver los mensajes de error que hemos definido en las anotaciones de datos:

Sin embargo, una cosa es que el usuario introduzca valores incorrectos desde el punto de vista de la lógica de nuestra aplicación, y otra cosa es que el usuario introduzca valores que ni siquiera se puedan parsear para obtener los tipos de datos que estamos esperando. En este caso, los mensajes de error no son proporcionados por las Data annotations sino por el propio framework, como vemos en la siguiente captura, donde hemos dejado en blanco los campos Score y BirthDate:

Estos textos de descripción del error, además de estar en inglés, no lo hemos definido nosotros por medio de anotaciones, por lo que no tenemos control sobre ellos. En una interfaz de usuario cuidada, no deberíamos dejarlo así.

La solución es bien sencilla. Basta con utilizar el atributo ParsingErrorMessage en los componentes de entrada de datos que nos interese, y suministrarle el texto que queramos que se muestre en caso de que el usuario introduzca un valor que no se pueda parsear. Por ejemplo:


...

Por supuesto, dado que el texto de este mensaje de error lo pasamos en un atributo del componente, nada impide que suministremos una expresión que podría haber sido obtenida desde los recursos localizados del proyecto, posibilitando así que estos mensajes aparezcan en el idioma del usuario.

Publicado en: www.variablenotfound.com.


This post first appeared on Variable Not Found, please read the originial post: here

Share the post

Personalizar los mensajes de error de parseado en formularios Blazor

×

Subscribe to Variable Not Found

Get updates delivered right to your inbox!

Thank you for your subscription

×