Cómo localizar el mensaje de validación (DataAnnotationsValidator) en el lado del servidor blazor


10

Estoy usando blazor 3.1 en la última versión de VS 2019.

hasta ahora puedo localizar etiquetas de página (título, campos de tabla, etc.)

En la ListEmployee.razorpágina puedo localizar el encabezado de la tabla, etc. y en la AddEmplyeeValidation.razorpágina puedo localizar las etiquetas del formulario, pero tengo problemas para localizar el mensaje de validación.

El mensaje de Employee.csvalidación para el mensaje de validación se define en este archivo y Resources/Datacarpeta con el nombre definido como Data.Employee.ar.resxy Data.Employee.ar.resxesto no funciona

usando System.ComponentModel.DataAnnotations;

espacio de nombres BlazorSPA1.Data {Public class Employee {[MaxLength (50)] public string Id {get; conjunto; }

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

    [Required]
    [StringLength(20)]
    public string Department { get; set; }
    [MaxLength(100)]
    public string Designation { get; set; }
    [MaxLength(100)]
    public string Company { get; set; }
    [MaxLength(100)]
    public string City { get; set; }
}

}

Cómo puedo cómo mensaje de validación de los archivos de recursos en función del idioma para el formulario Agregar empleado.

@page "/addemployeeValidation"
@inject NavigationManager NavigationManager
@inject IEmployeeService EmployeeService
@inject IStringLocalizer<AddEmployeeValidation> L

<h2>Create Employee</h2>
<hr />
<EditForm Model="@employee" OnValidSubmit="@CreateEmployee">
    <DataAnnotationsValidator />
    <ValidationSummary />
    <div class="row">
        <div class="col-md-8">
            <div class="form-group">
                <label for="Name" class="control-label">@L["Name"]</label>
                <input for="Name" class="form-control" @bind="@employee.Name" />
                <ValidationMessage For="@(()=> employee.Name)" />
            </div>
            <div class="form-group">
                <label for="Department" class="control-label">@L["Department"]</label>
                <input for="Department" class="form-control" @bind="@employee.Department" />
            </div>
            <div class="form-group">
                <label for="Designation" class="control-label">@L["Designation"]</label>
                <input for="Designation" class="form-control" @bind="@employee.Designation" />
            </div>
            <div class="form-group">
                <label for="Company" class="control-label">@L["Company"]</label>
                <input for="Company" class="form-control" @bind="@employee.Company" />
            </div>
            <div class="form-group">
                <label for="City" class="control-label">@L["City"]</label>
                <input for="City" class="form-control" @bind="@employee.City" />
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-md-4">
            <div class="form-group">
                <input type="submit" class="btn btn-primary" value="Save" />
                <input type="button" class="btn" @onclick="@Cancel" value="Cancel" />
            </div>
        </div>
    </div>
</EditForm>

@code {

    Employee employee = new Employee();

    protected async Task CreateEmployee()
    {
        await EmployeeService.CreateEmployee(employee);
        NavigationManager.NavigateTo("listemployees");
    }


    void Cancel()
    {
        NavigationManager.NavigateTo("listemployees");
    }
}   

Leí algunos artículos y probé pocas cosas, pero parece que nada funciona.

Código en Startup.cs`

services.AddServerSideBlazor (opciones => opciones.DetailedErrors = true);

    services.AddLocalization(options => options.ResourcesPath = "Resources");
    var supportedCultures = new List<CultureInfo> { new CultureInfo("en"), new CultureInfo("ar") };
    services.Configure<RequestLocalizationOptions>(options =>
    {
        options.DefaultRequestCulture = new Microsoft.AspNetCore.Localization.RequestCulture("en");
        options.SupportedUICultures = supportedCultures;
    });

Estoy usando el siguiente ejemplo para Localización, no muestra cómo localizar el mensaje de error https://www.c-sharpcorner.com/article/localization-in-blazor-server/

Imagen de estructura de carpeta para referencia

ingrese la descripción de la imagen aquí

Ejemplo de archivo de recursos para la versión en inglés de la misma manera también tengo un archivo en árabe

ingrese la descripción de la imagen aquí

En la siguiente captura de pantalla, el nombre del campo se extraerá del archivo de recursos, pero el mensaje de validación solo se muestra en inglés, ya que no funciona

ingrese la descripción de la imagen aquí

Respuestas:


7

Aquí está mi solución para localizar mensajes de error de anotación de datos. Creo dos archivos de recursos, uno para campos y otro para mensajes de error.

  • DisplayNameResource para localizar campos
  • ErrorMessageResource para localizar mensajes de error

ingrese la descripción de la imagen aquí ingrese la descripción de la imagen aquí ingrese la descripción de la imagen aquí ingrese la descripción de la imagen aquí

A la vista, la clase de modelo utiliza el Displayatributo para localizar el nombre del campo. Para especificar la ResourceTypepropiedad del archivo de recursos, use el Displayatributo:

[Display(Name = "Address", ResourceType = typeof(DisplayNameResource))]

Y en los atributos de validación use ErrorMessageResourceNamey ErrorMessageResourceTypepara especificar el archivo de recursos:

[Required(ErrorMessageResourceName = "RequiredError", ErrorMessageResourceType = typeof(ErrorMessageResource))]

Aquí hay un ejemplo completo:

public class SomeViewModel
{
    [Display(Name = "Address", ResourceType = typeof(DisplayNameResource))]
    [Required(ErrorMessageResourceName = "RequiredError", ErrorMessageResourceType = typeof(ErrorMessageResource))]
    [StringLength(256, ErrorMessageResourceName = "MaxLengthError", ErrorMessageResourceType = typeof(ErrorMessageResource))]
    public string Address { get; set; }

    [Display(Name = "Phone", ResourceType = typeof(DisplayNameResource))]
    [Required(ErrorMessageResourceName = "RequiredError", ErrorMessageResourceType = typeof(ErrorMessageResource))]
    [RegularExpression("^09([0-9]{9})$", ErrorMessageResourceName = "PhoneLengthError", ErrorMessageResourceType = typeof(ErrorMessageResource))]
    public string Phone { get; set; }

    [Display(Name = "Password", ResourceType = typeof(DisplayNameResource))]
    [Required(ErrorMessageResourceName = "RequiredError", ErrorMessageResourceType = typeof(ErrorMessageResource))]
    [StringLength(50, MinimumLength = 6, ErrorMessageResourceType = typeof(ErrorMessageResource), ErrorMessageResourceName = "MinxMaxLengthError")]
    public string Password { get; set; }

    [Display(Name = "ConfirmPassword", ResourceType = typeof(DisplayNameResource))]
    [Required(ErrorMessageResourceName = "RequiredError", ErrorMessageResourceType = typeof(ErrorMessageResource))]
    [StringLength(50, MinimumLength = 6, ErrorMessageResourceType = typeof(ErrorMessageResource), ErrorMessageResourceName = "MinxMaxLengthError")]
    [Compare("Password", ErrorMessageResourceName = "PasswordConfirmMisMatch", ErrorMessageResourceType = typeof(ErrorMessageResource))]
    public string ConfirmPassword { get; set; }
}

El mensaje de error para MaxLengthErrores {0} cannot be longer than {1} character, por {0}lo que se reemplazará con un nombre archivado localizado y {1}se reemplazará con el 256atributo que especificó en[StringLength(256,...


1
Probaré esto, parece que debería funcionar ... Te agradecería que pudieras publicar esto en Github, ya que este tipo de preguntas a menudo surgen y hay una gran cantidad de opciones multilingües ...
Aprendizaje

1
@Aprendizaje Voy a poner un ejemplo completo en github seguro.
Mohsen Esmailpour

Esto será de gran ayuda para muchos programadores como yo, ya que Blazor no tiene mucho ejemplo en mi contexto ...
Aprendizaje

1

Esto se ha preguntado antes:

¿Cómo agregar la localización de ViewModel a Blazor?

Sugerí que usar FluentValidation sería un mejor enfoque. Aquí hay un enlace a mi repositorio de Github que demuestra cómo podría funcionar:

https://github.com/conficient/BlazorValidationLocalization


Tenía este tipo de solución en mente, pero esto tendrá dos archivos modales para cada uno y si el proyecto es grande, será difícil de administrar, sí, esto es una solución y hacer que las cosas funcionen ...
Aprendizaje

No estoy muy seguro de lo que quiere decir con "dos archivos modales". Todavía puede usar resx con FluentValidation. ver fluentvalidation.net/localization
Quango

-1

¡No probé esto!

En los documentos oficiales de asp.net core hay una sección sobre cómo localizarlo. DataAnnotations Quizás encuentre algunas pistas allí .


Soy nuevo en asp.net core. Intenté algo diferente, pero no funcioné antes de publicar estas preguntas. Intenté buscar una solución por mi cuenta, por ejemplo, intenté algo diferente, pero no parece funcionar para mi caso ... fue un poco difícil Soy de antecedentes de formularios web asp.net sin experiencia en asp.net MVC ... así que mi enfoque es solo en las páginas principales de asp.net Razor ... veamos
Aprendizaje
Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.