web-dev-qa-db-fra.com

Validation à distance MVC 5

Je dois valider une valeur de champ de saisie d'utilisateur avant que le formulaire ne soit envoyé.

J'ai créé une action dans mon contrôleur personnalisé et décoré le champ avec:

nom de l'action: CheckValue nom du contrôleur: Validate

[Remote("CheckValue", "Validate"), ErrorMessage="Value is not valid"]
public string Value { get; set; }

Le problème est que lorsque je clique sur Soumettre, le formulaire est en cours d'envoi, puis le message Value is not valid s'affiche si la valeur entrée par l'utilisateur n'est pas valide.

Comment puis-je valider la valeur entrée par l'utilisateur et empêcher le formulaire d'être envoyé si la valeur n'est pas valide et afficher le message d'erreur?

Si j'essaie en JavaScript de vérifier si le formulaire est valide $("#formId").valid() qui renvoie true, cela signifie que le statut est valide (valide ou non).

D'autre part, si je décore un autre champ avec l'attribut [Required], le formulaire n'est pas soumis et l'erreur est affichée pour ce champ requis. Cependant, la validation ne se produit pas en coulisse pour le champ de validation à distance.

validationasp.net-mvc-5data-annotationsremote-validation
21
user2818430

La solution complète de validation à distance dans MVC. Il vérifiera si l'email existe dans la base de données et affichera l'erreur suivante: 

L'email existe déjà

  1. Action du contrôleur de compte 

    [AllowAnonymous]
[HttpPost]
public ActionResult CheckExistingEmail(string Email)
{
    try
    {
        return Json(!IsEmailExists(Email));
    }
    catch (Exception ex)
    {
        return Json(false);
    }
}

private bool IsEmailExists(string email)
    =>  UserManager.FindByEmail(email) != null;

  2. Ajouter la validation du modèle 

    [Required]
[MaxLength(50)]
[EmailAddress(ErrorMessage = "Invalid Email Address")]
[System.Web.Mvc.Remote("CheckExistingEmail", "Account", HttpMethod = "POST", ErrorMessage = "Email already exists")]
public string Email { get; set; }

  3. Ajouter des scripts 

    <script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
33
adnan

Oui, vous devez ajouter [Remote] à votre modèle:

[Remote("ActionName", "ControllerName", ErrorMessage = "{0} Is somthing!")]
public string yourproperty { get; set; }

Et contrôleur:

public JsonResult ActionName(string yourproperty)
{
    return Json(!db.yourproperty.Any(lo => lo.yourproperty== yourproperty), JsonRequestBehavior.AllowGet);
}

Fonctionne bien pour moi J'espère vous sera utile.

4
Archil Labadze

Avec la référence de c-sharpcorner demo

Nous pouvons utiliser RemoteAttribute.

Étape 1

Dans HomeController, créez une méthode et écrivez ce qui suit.

public JsonResult IsUserExists(string UserName)   
{  
//check if any of the UserName matches the UserName specified in the Parameter using the ANY extension method.  
return Json(!db.Users.Any(x => x.UserName == UserName) ,JsonRequestBehavior.AllowGet);  
}

Vous vous demandez peut-être pourquoi nous renvoyons JsonResult. Nous voulons que la validation ait lieu du côté client, nous retournons donc un JsonResult.

Étape 2 

L'étape suivante consiste à connecter cette méthode à la propriété username. Pour cela, nous devons d'abord ajouter un fichier de classe dans le dossier models, ajouter une classe User partielle et fournir la personnalisation requise à la propriété UserName.

using System.ComponentModel.DataAnnotations;  
using System.Web.Mvc;   
namespace UniqueField.Models 
{  
   [MetadataType(typeof(UserMetaData))]  
   public partial class User 
   {  
   }  
class UserMetaData 
{  
   [Remote("IsUserExists","Home",ErrorMessage="User Name already in use")]  
   public string UserName { get; set; }  
}  
}

Étape 3

Dans create.cshtml, nous devons spécifier la source des trois fichiers jQuery dans l'ordre donné.

<h2>Create</h2>  
<script src="~/Scripts/jquery-1.10.2.js"></script>  
<script src="~/Scripts/jquery.validate.js"></script>  
<script src="~/Scripts/jquery.validate.unobtrusive.js"></script>
2
Rahul Modi

Vous ne mettez pas le code du contrôleur. Mais doit être quelque chose comme ça:

Votre code: 

[Remote("CheckValue", "Validate", ErrorMessage="Value is not valid")]
public string Value { get; set; }

Mon code pour le contrôleur (Valider): 

public ActionResult CheckValue(string Value)
        {
            if (Value == "x value")
            {
        // This show the error message of validation and stop the submit of the form
                return Json(true, JsonRequestBehavior.AllowGet);
            }
            else
            {
        // This will ignore the validation and the submit of the form is gone to take place.
               return Json(false, JsonRequestBehavior.AllowGet);
            }
        }
1
Ali Briceño

Les réponses existantes sont excellentes mais il y a quelques pièges:

1) Le nom du paramètre de la méthode de validation doit correspondre exactement au nom de la propriété en cours de validation, par exemple. pour

[System.Web.Mvc.Remote("CheckExistingDocumentTypeCode", "DocumentTypes", HttpMethod = "POST", ErrorMessage = "Code already exists")]
public string DocumentTypeCode { get; set; }

Le paramètre de la méthode de validation doit être appelé DocumentTypeCode, y compris la lettre majuscule, sinon vous obtiendrez la valeur null en tant que paramètre au lieu de la valeur de la propriété en cours de validation:

[AllowAnonymous]
[HttpPost]
public async Task<ActionResult> CheckExistingDocumentTypeCode(string DocumentTypeCode)

Méfiez-vous particulièrement de cela si vous êtes un utilisateur de Resharper, ou si vous écrivez des méthodes de validation à usages multiples destinées à être utilisées par plusieurs propriétés.

2) Je devais le faire fonctionner avec une grille Telerik et je devais l'implémenter légèrement différemment pour que les messages d'échec de validation soient correctement affichés dans la grille (les exemples ici montraient 'false' comme message d'erreur de validation):

[AllowAnonymous]
[HttpPost]
public async Task<ActionResult> CheckExistingDocumentTypeCode(string DocumentTypeCode)
{
    try
    {
        if (!await IsDocTypeCodeExists(DocumentTypeCode))
        {
            return Json(true, JsonRequestBehavior.AllowGet);
        }
        return Json("This Document Type Code is already in use", JsonRequestBehavior.AllowGet);
    }
    catch (Exception ex)
    {
        return Json(ex.ToString(), JsonRequestBehavior.AllowGet);
    }
}
0
tomRedox