我有一个带有电子邮件地址属性和确认电子邮件地址属性的视图模型,如下所示:
public class UserNewModel
{
[Required]
[StringLength(100)]
[DataType(DataType.EmailAddress)]
[Display(Name = "Email Address")]
public string EmailAddress { get; set; }
[Required]
[StringLength(100)]
[DataType(DataType.EmailAddress)]
[Display(Name = "Confirm Email Address")]
[Compare("EmailAddress", ErrorMessage = "The email address and confirmation email address do not match.")]
public string ConfirmEmailAddress { get; set; }
}
有一个对应的 EditorTemplate 强类型化到这个模型:
@model SponsorworksSaaS.UI.Models.UserNewModel
<div class="editor-label">
@Html.LabelFor(m => m.EmailAddress)
</div>
<div class="editor-field">
@Html.EditorFor(m => m.EmailAddress)
@Html.ValidationMessageFor(m => m.EmailAddress)
</div>
<div class="editor-label">
@Html.LabelFor(m => m.ConfirmEmailAddress)
</div>
<div class="editor-field">
@Html.EditorFor(m => m.ConfirmEmailAddress)
@Html.ValidationMessageFor(m => m.ConfirmEmailAddress)
</div>
然后我的 UserNewModel 包含在其他模型中,例如:
public class CompanyDetailsModel
{
....
/// <summary>
/// Used to capture the initial user account details when creating a new company
/// </summary>
[Display(Name = "Initial User Account")]
public UserNewModel NewCompanyUser { get; set; }
}
并且与此父模型关联的相应强类型视图使用@Html.EditorFor 来显示编辑器模板:
@model SponsorworksSaaS.UI.Models.CompanyDetailsModel
<script src="@Url.Content("~/Scripts/jquery.validate.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.js")" type="text/javascript"></script>
@using (Html.BeginForm())
{
@Html.ValidationSummary(true, "Company change was unsuccessful. Please correct the errors and try again.")
<div>
<fieldset>
<legend>Company Information</legend>
<div>
@Html.EditorFor(m => m.NewCompanyUser)
</div>
<p>
<input type="submit" name="btnSubmit" value="Save Company" />
</p>
</fieldset>
</div>
}
客户端的比较验证对于电子邮件地址总是失败。如果我在比较电子邮件地址文本框中输入相同的字符串,当我将焦点移开时,它总是会显示比较验证错误消息。即使比较验证在客户端显示失败,如果我提交表单 ModelState.IsValid 为真,尽管我不确定是否在服务器端进行了任何比较验证。
生成的视图源如下图所示:
<div class="editor-label">
<label for="NewCompanyUser_EmailAddress">Email Address</label>
</div>
<div class="editor-field">
<input class="text-box single-line" data-val="true" data-val-length="The field Email Address must be a string with a maximum length of 100." data-val-length-max="100" data-val-required="The Email Address field is required." id="NewCompanyUser_EmailAddress" name="NewCompanyUser.EmailAddress" type="text" value="" />
<span class="field-validation-valid" data-valmsg-for="NewCompanyUser.EmailAddress" data-valmsg-replace="true"></span>
</div>
<div class="editor-label">
<label for="NewCompanyUser_ConfirmEmailAddress">Confirm Email Address</label>
</div>
<div class="editor-field">
<input class="text-box single-line" data-val="true" data-val-equalto="The email address and confirmation email address do not match." data-val-equalto-other="*.EmailAddress" data-val-length="The field Confirm Email Address must be a string with a maximum length of 100." data-val-length-max="100" data-val-required="The Confirm Email Address field is required." id="NewCompanyUser_ConfirmEmailAddress" name="NewCompanyUser.ConfirmEmailAddress" type="text" value="" />
<span class="field-validation-valid" data-valmsg-for="NewCompanyUser.ConfirmEmailAddress" data-valmsg-replace="true"></span>
</div>
我已经尝试向 jquery.validate.unobtrusive.js 文件添加单引号,正如此处其他帖子所建议的那样,但这并没有解决问题。
element = $(options.form).find(":input[name=" + fullOtherName + "]")[0];
变成:
element = $(options.form).find(":input[name='" + fullOtherName + "']")[0];
我也尝试过使用 min 和 full js 文件,但问题仍然存在。事实上,如果我在 ready 函数中添加一些 jquery:
$(function () {
var e1 = $('form').find(":input[name=*.EmailAddress]");
var e2 = $('form').find(":input[name='*.EmailAddress']");
alert(e1);
alert(e1[0]);
alert(e2);
alert(e2[0]);
});
alert(e2[0]) 返回 undefined,但 alert(e1[0]) 返回预期的文本框元素。