Validation manuelle des formulaires dans MVC 3 et JQuery

Je veux pouvoir déclencher la validation du formulaire côté client lorsque l’utilisateur sélectionne le bouton “GO”. Actuellement, lorsque le bouton “GO” est sélectionné, il ne valide pas le formulaire complet. Par exemple, si je charge le formulaire et sélectionne le bouton “Aller” sans donner le focus à la zone de texte, rien n’est validé et val.Valid () renvoie true. Si j’entre des données non valides dans une zone de texte, la validation est exécutée pour cet élément individuel; et lorsque je sélectionne le bouton “GO”, val.Valid () renvoie false.

Donc, ce que j’essaie de faire, c’est lorsqu’un utilisateur sélectionne un bouton ou un autre événement, je veux déclencher toutes les validations de formulaires.

Je fais ça dans MVC 3

public class TestValidationModel { [Required(ErrorMessage="UserName Is Required")] [RegularExpression(@"(\S)+", ErrorMessage = "White space is not allowed")] [SsortingngLength(12, MinimumLength = 3)] public ssortingng UserName { get; set; } [Required(ErrorMessage="Password Is Required")] [SsortingngLength(20, MinimumLength = 3)] public ssortingng Password { get; set; } [Required(ErrorMessage="Email Address Is Required")] [Display(Name = "Email Address")] public ssortingng EmailAddress{ get; set; } }      $(function () { $("#butValidateForm").click(function(){ var val = $('#myForm').validate() alert(val.valid()); }) });  @using (Html.BeginForm("", "", FormMethod.Post, new {id = "myForm"})) { 
@Html.LabelFor(m => m.UserName) @Html.TextBoxFor(m => m.UserName) @Html.ValidationMessageFor(m => m.UserName)
@Html.LabelFor(m => m.Password) @Html.TextBoxFor(m => m.Password) @Html.ValidationMessageFor(m => m.Password)
@Html.LabelFor(m => m.EmailAddress) @Html.TextBoxFor(m => m.EmailAddress) @Html.ValidationMessageFor(m => m.EmailAddress)
}

Mettre à jour

Je pense avoir trouvé la solution à mon problème. Voir showErrors ci-dessous

   $(function () { $("#butValidateForm").click(function () { var val = $('#myForm').validate(); val.showErrors(); //<-- Call showErrors alert(val.valid()); }) });  

Ce lien vers le message sur les formulaires JQuery n’était pas lié à mon problème, mais j’ai pu trouver les noms de méthode que je cherchais. http://plugins.jquery.com/content/jqueryvalidate-showerrors-issue-form-wizard

Si quelqu’un a une meilleure réponse, veuillez donner votre avis.


Mettre à jour

Le code précédent fonctionne quelque peu dans Firefox, mais pas du tout dans IE. J’ai fait ce qui suit et cela fonctionne maintenant dans Firefox mais toujours pas dans l’ID

  $(function () { $("#myForm").submit(function (e) { var val = $('#myForm').validate(); //<--added the semi-colon val.showErrors(); alert(val.valid()); e.preventDefault(); }); }); // $("#butValidateForm").click(function () { // var val = $('#myForm').validate() // val.showErrors(); // alert(val.valid()); // }) }); 

Merci d’avoir utilisé jQuery pour détourner des messages de formulaire ASP.NET MVC pour m’avoir orienté dans la bonne direction. Mais toujours pas parfait

Je ne sais pas si c’est le moyen le plus efficace, mais je le fais en validant chaque élément individuellement dans ma propre fonction.

 jQuery(document).ready(function () { $("#butValidateForm").button().click(function () { return IsMyFormValid(); }); $('#myForm').validate(); } function IsMyFormValid() { var isValid = false; isValid = $('#myForm').validate().element($('#UserName ')); isValid = ($('#myForm').validate().element($('#Password '))) ? isValid : false; isValid = ($('#myForm').validate().element($('#EmailAddress'))) ? isValid : false; return isValid; } 

Ce serait formidable de le laisser valider automatiquement, mais il semble que je rencontre toujours une règle de logique commerciale étrange qui ne soit pas interceptée par les méthodes de validation génériques. En procédant de cette manière, je peux contrôler toute la validation comme je le souhaite, mais en s’appuyant sur la validation intégrée la plupart du temps.

  

Je ne sais pas si vous avez compris cela, mais j’ai rencontré la même chose dans IE avec $("#myForm").submit . Utiliser en live :

 $("#myForm").live('submit', function (e) { var val = $('#myForm').validate(); //<--added the semi-colon val.showErrors(); alert(val.valid()); e.preventDefault(); }); 

Cela ne fonctionne pas dans IE car il manque un point-virgule:

 var val = $('#myForm').validate()