客户端验证只有一半工作,适用于textarea,而不是文本框

时间:2010-12-14 23:02:45

标签: c# visual-studio-2010 asp.net-mvc-2 validation client-side

首先让我解释一下我的情况。现在,我的表单的服务器端验证工作,现在我正在尝试让客户端验证为我的表单工作。目前我的表单有文本框和textarea,但只有文本区域使用客户端验证,我的文本框都没有。如果我点击提交按钮,使用fiddler我可以看到它仍在调用服务器来验证表单。任何人都可以帮助我理解为什么客户端验证将适用于我的textarea,但不适用于我的文本框。我是asp.net和C#的新手,所以任何帮助都将不胜感激。

到目前为止,我已经在几个网站上寻求帮助:

MVC 2 Client side validation is not working

客户端验证 - Pietro Brambati的博客

Haacked.com - MVC 2自定义验证

Scott Gu的博客 - 模型验证

和其他几个我已经关闭了标签的人。我为无法将它们全部链接而道歉,但由于这是我的第一篇帖子,我只允许一个链接。这是我的代码,

从母版页:

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

来自表格:

<%@ 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>--%>

视图模型代码(正如您所看到的那样,第一个[Required]标签中包含AllowEmptyString,我从其他文章中读过,并告诉您我已经测试过它):

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

我的控制器(这没关系,因为它假设验证客户端的所有内容。

从&lt;%Html.EnableClientValidation()生成的脚本; %GT;

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

请帮助我,我正在运行VS 2010,并使用ASP.NET MVC 2.0。由于某种原因,文本区域将工作,而我的文本框都没有。

1 个答案:

答案 0 :(得分:1)

尝试大写每个文本框的ID。