Comment localiser le message de validation (DataAnnotationsValidator) côté serveur Blazor


10

J'utilise blazor 3.1 dans la dernière version de VS 2019.

jusqu'à présent, je suis capable de localiser les étiquettes de page (titre, champs de table, etc.)

Dans la ListEmployee.razorpage je suis en mesure de localiser la table , etc. rubrique et la AddEmplyeeValidation.razorpage que je suis en mesure d'étiquettes en Localize mais j'ai problème localisant le message de validation.

pour le message de Employee.csvalidation pour le message de validation sont définis dans ce fichier et Resources/Datadossier avec un nom défini comme Data.Employee.ar.resxet Data.Employee.ar.resxcela ne fonctionne pas

using System.ComponentModel.DataAnnotations;

espace de noms BlazorSPA1.Data {public class Employee {[MaxLength (50)] public string Id {get; ensemble; }

    [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; }
}

}

Comment je peux comment le message de validation des fichiers de ressources basé sur la langue du formulaire Ajouter un employé.

@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");
    }
}   

J'ai lu quelques articles et essayé peu de choses mais rien ne semble fonctionner

Code dans Startup.cs`

services.AddServerSideBlazor (options => options.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;
    });

J'utilise l'exemple suivant pour la localisation, il ne montre pas comment localiser le message d'erreur https://www.c-sharpcorner.com/article/localization-in-blazor-server/

Image de structure de dossier pour la réfrence

entrez la description de l'image ici

Exemple de fichier de ressources pour la version anglaise de la même manière que j'ai également un fichier arabe

entrez la description de l'image ici

Dans la capture d'écran ci-dessous, le nom du champ est extrait du fichier de ressources, mais le message de validation ne s'affiche qu'en anglais car il ne fonctionne pas

entrez la description de l'image ici

Réponses:


7

Voici ma solution pour localiser les messages d'erreur d'annotation de données. Je crée deux fichiers de ressources, un pour les champs et un autre pour les messages d'erreur.

  • DisplayNameResource pour localiser des champs
  • ErrorMessageResource pour localiser les messages d'erreur

entrez la description de l'image ici entrez la description de l'image ici entrez la description de l'image ici entrez la description de l'image ici

Dans la classe de modèle d'affichage, utilisez l' Displayattribut pour localiser le nom du champ. Pour spécifier la ResourceTypepropriété d' utilisation du fichier de ressources sur l' Displayattribut:

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

Et sur les attributs de validation, utilisez ErrorMessageResourceNameet ErrorMessageResourceTypepour spécifier le fichier de ressources:

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

Voici un exemple complet:

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; }
}

Le message d'erreur pour MaxLengthErrorest {0} cannot be longer than {1} character, {0}sera donc remplacé par un nom de fichier localisé et {1}sera remplacé par le256 attribut que vous avez spécifié sur[StringLength(256,...


1
Je vais essayer cela, il semble que cela devrait fonctionner .. J'apprécierais que vous puissiez poster ceci sur Github car ce type ou cette question sera souvent soulevée et il y a un grand nombre d'options multilingues ..
Apprentissage le

1
@Learning Je vais certainement mettre un exemple complet sur github.
Mohsen Esmailpour

Cela sera d'une grande aide pour beaucoup de programmeurs comme moi car Blazor n'a pas beaucoup d'exemples dans mon contexte ...
Apprentissage le

1

Cela a déjà été demandé:

Comment ajouter la localisation de ViewModel à Blazor?

J'ai suggéré que l'utilisation de FluentValidation serait une meilleure approche. Voici un lien vers mon dépôt Github qui montre comment cela pourrait fonctionner:

https://github.com/conficient/BlazorValidationLocalization


J'avais ce genre de solution en tête mais ce sera deux fichiers modaux pour chacun et si le projet est volumineux il deviendra difficile à gérer, oui c'est une solution de contournement et faire fonctionner les choses ...
Apprentissage le

Je ne sais pas trop ce que vous entendez par "deux fichiers modaux". Vous pouvez toujours utiliser resx avec FluentValidation. voir fluentvalidation.net/localization
Quango

-1

Je n'ai pas essayé ça!

Dans les documents officiels du noyau asp.net, il y a une section sur la localisation DataAnnotations Peut-être que vous y trouvez des indices .


Je suis nouveau sur asp.net core j'ai essayé une chose différente mais je n'ai pas travaillé avant de poster ces questions j'ai essayé de chercher une solution par moi-même en regardant l'exemple, en essayant une chose différente mais cela ne semble pas fonctionner pour mon cas ... ça a été un peu difficile Je suis de l'arrière-plan du formulaire Web asp.net sans expérience dans MVC asp.net ... donc je me concentre uniquement sur les pages de base de aspaz Razor .. voyons
Apprentissage le
En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.