0
我一直在使用Html.ValidationMessageFor很長一段時間在MVC 3.突然間，這個擴展名不再爲我工作，但只在一個特定的視圖。擴展名用於<form>標記，頁面附有jquery.validate.min.js和jquery.validate.unobtrusive.min.js（等等）。我查看了該網站的其他頁面，這些視圖使用相同的呼叫，並且生成了<span>元素。Html.ValidationMessageFor（）不渲染<span>元素
這裏是我使用的標記：
<form id="assistanceRequestDiv" class="form-group js-more-assistance js-hidden">
<p>@Translation.TextByDomain("Assistance", "need-further-assistance-contact-customer-support")</p>
<div class="content-block left-text-children">
<div class="content-block__quarter-column">
@Html.LabelFor(x => x.AssistanceRequestFirstName)
@Html.ValidationMessageFor(x => x.AssistanceRequestFirstName)
@Html.TextBoxFor(x => x.AssistanceRequestFirstName, new {@class = "form-control", required = "required"})
</div>
<div class="content-block__quarter-column">
@Html.LabelFor(x => x.AssistanceRequestLastName)
@Html.ValidationMessageFor(x => x.AssistanceRequestLastName)
@Html.TextBoxFor(x => x.AssistanceRequestLastName, new {@class = "form-control", required = "required"})
</div>
<div class="content-block__quarter-column">
@Html.LabelFor(x => x.AssistanceRequestPhoneNumber)
@Html.ValidationMessageFor(x => x.AssistanceRequestPhoneNumber)
@Html.TextBoxFor(x => x.AssistanceRequestPhoneNumber, new {@class = "form-control"})
</div>
<div class="content-block__quarter-column set-vertical-align-bottom">
<button id="btnSubmitAssistanceRequest" class="btn btn--primary">@Translation.Text("submit")</button>
</div>
</div>
</form>
數據註釋
[RequiredLocalized, DisplayNameLocalized("first-name")]
public string AssistanceRequestFirstName { get; set; }
[RequiredLocalized, DisplayNameLocalized("last-name")]
public string AssistanceRequestLastName { get; set; }
[RequiredLocalized, DisplayNameLocalized("phone-required")]
[RegularExpressionLocalized(@"(?:(?:\+?1\s*(?:[.-]\s*)?)?(?:(\s*([2-9]1[02-9]|[2-9][02-8]1|[2-9][02-8][02-9])\s*)|([2-9]1[02-9]|[2-9][02-8]1|[2-9][02-8][02-9]))\s*(?:[.-]\s*)?)([2-9]1[02-9]|[2-9][02-9]1|[2-9][02-9]{2})\s*(?:[.-]\s*)?([0-9]{4})", "please-enter-a-valid-10-digit-phone-number", "Assistance")]
public string AssistanceRequestPhoneNumber { get; set; }
- RequiredLocalized - 必需的屬性，它返回一個自定義消息。在網站的其他地方工作。
- DisplayNameLocalized - 帶自定義消息的DisplayName屬性。在其他地方工作。
- 等
這種形式被默認隱藏和顯示，當用戶點擊某個按鈕。下面是連接到網頁中的腳本：
<script src="/Scripts/jquery-1.8.3.min.js"></script> <script src="/Scripts/jquery-ui-1.10.4.custom.min.js"></script> <script src="/Scripts/jquery.unobtrusive-ajax.min.js"></script> <script src="/Scripts/jquery.validate.min.js"></script> <script src="/Scripts/jquery.validate.unobtrusive.min.js"></script> <script src="/Scripts/jquery.validate.extensions.js"></script> <script src="/Scripts/Shared/jQueryGlobalSettings.js"></script>
使用JavaScript，如果有這種格式的網頁上有錯誤返回false：
$('#btnSubmitAssistanceRequest').click(function (e) {
var $answer = $('.js-title');
var $reqFirstName = $('#AssistanceRequestFirstName');
var $reqLastName = $('#AssistanceRequestLastName');
var $reqPhoneNumber = $('#AssistanceRequestPhoneNumber');
// Check for empty fields
if ($reqFirstName.val().trim() == "") {
showErrorMessage($reqFirstName, 'First Name is required.');
} else {
clearErrorMessage($reqFirstName);
}
if ($reqLastName.val().trim() == "") {
showErrorMessage($reqLastName, 'Last Name is required.');
} else {
clearErrorMessage($reqLastName);
}
if ($reqPhoneNumber.val().trim() == "") {
showErrorMessage($reqPhoneNumber, 'Phone Number is required.');
} else {
clearErrorMessage($reqPhoneNumber);
}
// check if validation errors were thrown
if ($(".field-validation-error").length) return false;
$.post('/api/[obfuscated]/[obfuscated]', { answer: $answer.text(), firstName: $reqFirstName.val(), lastName: $reqLastName.val(), phoneNumber: $reqPhoneNumber.val() }, function (data) {
if (data.success) {
$('.request-assistance-success').css('display', 'inline');
$(".feedback-container").slideUp(400);
} else {
$('.request-assistance-failure').css('display', 'inline');
$(".feedback-container").slideUp(400);
}
});
e.preventDefault();
return true;
});