2010-12-14 104 views
1

Laissez-moi commencer par expliquer ma situation. À l'heure actuelle, la validation côté serveur de mon formulaire fonctionne, et maintenant j'essaie d'obtenir la validation côté client pour mon formulaire. Actuellement, mon formulaire contient à la fois des zones de texte et une zone de texte, mais seule la zone de texte utilise la validation côté client, aucune de mes zones de texte ne l'est. Si j'appuie sur le bouton submit, en utilisant fiddler je peux voir qu'il appelle toujours le serveur pour valider le formulaire. Quelqu'un peut-il m'aider s'il vous plaît à comprendre pourquoi la validation côté client fonctionnera pour ma zone de texte, mais ne fonctionnera pas pour mes zones de texte. Je suis très nouveau sur asp.net et C# donc toute aide sera grandement appréciée.Validation côté client seulement la moitié fonctionne, fonctionne pour une zone de texte, pas une zone de texte

Je l'ai regardé sur plusieurs sites jusqu'à l'aide:

MVC 2 Client side validation is not working

validation côté client - Pietro Blog Brambati

Haacked.com - MVC 2 Validation personnalisée

Blog de Scott Gu - Validation du modèle

et plusieurs autres dont j'ai juste déjà fermé les onglets. Je m'excuse de ne pas être en mesure de leur faire tous les liens, mais comme c'est mon premier message, je n'ai qu'un seul lien. Voici mon code,

partir de la page principale:

<script src="<%: Url.Content("~/Scripts/jquery-1.4.1.js") %>" type="text/javascript"></script> 
<script src="<%: Url.Content("~/Scripts/MicrosoftAjax.js") %>" type="text/javascript"></script> 
<script src="<%: Url.Content("~/Scripts/MicrosoftMvcAjax.js") %>" type="text/javascript"></script> 
<script src="<%: Url.Content("~/Scripts/MicrosoftMvcValidation.js") %>" type="text/javascript"></script> 

de la forme:

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="HaveAQuestion.ascx.cs" 
Inherits="ViewUserControl<HaveAQuestionViewModel>" %> 
<% Html.EnableClientValidation(); %> 
<div id="HaveAQuestion"> 
<%--<form method="post" action="<%= Url.Action("SendMessage", "Home") %>">--%> 
<%using (Html.BeginForm("SendMessage", "Home", FormMethod.Post)) 
    {%> 
<fieldset id="signin_menu" <% if (!ViewData.ModelState.IsValid) {%> 
    style="display: block;" 
<%} %> > 
    <div style="padding: 25px"> 
     <div class="FieldTitle"> 
      First & Last Name 
      <%=Html.ValidationMessageFor(a => a.Name)%> 
      </div> 
     <div class="FieldArea"> 
      <%--<input id="username" name="username" value="" class="Fields" title="username" type="text">--%> 
      <%= Html.TextBox("name", Model.Name, new { id = "name", title = "name", @class = "Fields" })%> 
     </div> 
     <div class="FieldTitle"> 
      Phone 
      <%=Html.ValidationMessageFor(a => a.Phone)%> 
      </div> 
     <div class="FieldArea"> 
      <%--<input id="username" name="username" value="" class="Fields" title="username" type="text">--%> 
      <%= Html.TextBox("phone", Model.Phone, new { id = "phone", title = "phone", @class = "Fields" })%> 
     </div> 
     <div class="FieldTitle"> 
      Email 
      <%=Html.ValidationMessageFor(a => a.Email)%> 
     </div> 
     <div class="FieldArea"> 
      <%--<input id="username" name="username" value="" class="Fields" title="username" type="text">--%> 
      <%= Html.TextBox("email", Model.Email, new { id = "email", title = "email", @class = "Fields" })%> 
     </div> 
     <div class="FieldTitle"> 
      Comments/Questions 
      <%=Html.ValidationMessageFor(a => a.CommentsOrQuestions)%> 
      </div> 
     <div class="TextArea"> 
      <%= Html.TextArea("CommentsOrQuestions", Model.CommentsOrQuestions, 4, 100, new { id = "CommentsOrQuestions", title = "comments", @class = "TextAreaField" })%> 
     </div> 
     <div style="padding-top: 10px">   
      <%= Html.ValidationMessage("error")%> 
      <% if (!ViewData.ModelState.IsValid) 
       {%><br /><%} %>     
      <input type="submit" value="Submit"/> 
     </div> 
</fieldset> 
<%} %> 
<%--</form>--%> 

Le point de vue modèle de code (Comme vous pouvez le voir la première [Obligatoire] tag a AllowEmptyString dans celui que j'avais lu d'un article différent, et pour vous montrer que je l'ai testé):

public class HaveAQuestionViewModel 
{ 
    [Required(AllowEmptyStrings = false, ErrorMessage = "*")] 
    public string Name { get; set; } 

    [Required(ErrorMessage = "*")] 
    //this is my own regular expression that I created 
    [RegularExpression("^[a-zA-Z0-9]+[\\.a-zA-Z0-9_]*[@][.a-zA-Z0-9]+[.]([a-z]{2,4})$", ErrorMessage = "*")] 

    public string Email { get; set; } 

    [Required(ErrorMessage = "*")] 
    // Will take ddd-ddd-dddd or (ddd)ddd-dddd, or (ddd)-ddd-dddd 
    [RegularExpression("[(]*([0-9]{3})[)]*[-]*([0-9]{3})[-]([0-9]{4})$" , ErrorMessage = "*")] 
    public string Phone { get; set; } 

    [Required(ErrorMessage = "*")] 
    public string CommentsOrQuestions { get; set; } 
} 

Mon contrôleur (cela n'a pas d'importance car il est supposé valider tout du côté client.

Le script en cours de production à partir de <% Html.EnableClientValidation(); %>

<script type="text/javascript"> 
//<![CDATA[ 
if (!window.mvcClientValidationMetadata) 
{ window.mvcClientValidationMetadata = []; } 
window.mvcClientValidationMetadata.push(
{"Fields":[{"FieldName":"Name","ReplaceValidationMessageContents":true, 
"ValidationMessageId":"Name_validationMessage", 
"ValidationRules":[{"ErrorMessage":"*","ValidationParameters": },"ValidationType":"required"}]}, 
{"FieldName":"Phone","ReplaceValidationMessageContents":true, 
"ValidationMessageId":"Phone_validationMessage", 
"ValidationRules":[{"ErrorMessage":"*","ValidationParameters":{"pattern":"[(]*([0-9] {3})[)]*[-]*([0-9]{3})[-]([0-9]{4})$"}, 
"ValidationType":"regularExpression"}, 
{"ErrorMessage":"*","ValidationParameters":{},"ValidationType":"required"}]}, 
{"FieldName":"Email","ReplaceValidationMessageContents":true, 
"ValidationMessageId":"Email_validationMessage", 
"ValidationRules":[{"ErrorMessage":"*","ValidationParameters":{"pattern":"^[a-zA-Z0-9]+[\\.a-zA-Z0-9_]*[@][.a-zA-Z0-9]+[.]([a-z]{2,4})$"}, 
"ValidationType":"regularExpression"},{"ErrorMessage":"*","ValidationParameters":{}, 
"ValidationType":"required"}]}, 
{"FieldName":"CommentsOrQuestions","ReplaceValidationMessageContents":true, 
"ValidationMessageId":"CommentsOrQuestions_validationMessage", 
"ValidationRules":[{"ErrorMessage":"*","ValidationParameters": {},"ValidationType":"required"}]}, 
{"FieldName":"error","ReplaceValidationMessageContents":true, 
"ValidationMessageId":"error_validationMessage","ValidationRules": []}],"FormId":"form0","ReplaceValidationSummary":false}); 
//]]> 
</script> 

S'il vous plaît aidez-moi, je suis en cours d'exécution VS 2010, et en utilisant ASP.NET MVC 2.0. Pour une raison quelconque, la zone de texte fonctionnera alors qu'aucune de mes zones de texte ne le fera.

+0

Microsoft a créé le javascript à partir de son RegEx, alors ASP.NET ne serait-il pas capable de faire des conversions si nécessaire? Je ne peux pas vous dire si c'est le cas, ou pas, mais le champ Nom n'a pas d'expression RegEx utilisée, et il a le même problème que mes deux autres zones de texte. – 4everAStudent

Répondre

1

Essayez de mettre en majuscule l'ID de chaque zone de texte.

+1

Ouais, c'est le nom des Textboxes. Si Html.TextBoxFor était utilisé, il aurait utilisé le nom exact de la propriété du modèle, puis la validation fonctionnerait. –

+0

J'ai essayé de mettre en majuscules l'ID de chaque zone de texte ID = "EMAIL etc. sans succès :-(La raison pour laquelle j'utilise textboxers est de garder le design de la page – 4everAStudent

+0

LOL, je voulais dire" Email "afin qu'il corresponde vos déclarations de validation –