ビューの 1 つに電子メール フィールドの検証を配置しようとしています。
しかし、残念ながらそれは機能していません。誰か助けてくれませんか。
これは私の HTML です。
<!DOCTYPE html>
<html class="no-js">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>About SJ Electrical Ltd</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width">
<script src="/Content/js/vendor/modernizr-2.6.2.min.js"></script>
</head>
<body>
<div id="main">
<section class="main-content">
<form action="/info/contact" method="post"> <div id="contact-content">
<article class="double-columned">
<header></header>
<img id="map-image" src="/Content/img/map.png" />
<p>
<span class="bold">Request a call Back
</span>
</p>
<div class="one-third-column">
<label for="Name">Name:</label>
<input class="text-box single-line" id="Name" name="Name" type="text" value="" />
<label for="Email">Email Address:</label>
<input class="text-box single-line" data-val="true" data-val-required="Email address required." id="Email" name="Email" type="email" value="" />
<span class="field-validation-valid" data-valmsg-for="Email" data-valmsg-replace="true"></span>
</div>
<div class="one-third-column">
<label for="Message">Comments:</label>
<textarea cols="20" id="Message" name="Message" rows="4">
</textarea>
<div>
<input type="button" id="btnSendMessage" value="Submit" />
</div>
</div>
</article>
</div>
</form>
</section>
</div>
<script src="/Scripts/jquery-1.7.1.js"></script>
<script src="/Scripts/jquery.unobtrusive-ajax.js"></script>
<script src="/Scripts/jquery.validate.js"></script>
<script src="/Scripts/jquery.validate.unobtrusive.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#btnSendMessage").on("click", sendCallBackRequest);
});
function sendCallBackRequest() {
$.ajax({
type: 'POST',
url: '/Contact/SendJSonMessage',
//data: $('#form').serialize(),
data: contactRequest,
contentType: "application/json; charset=utf-8",
traditional: true,
success: sentMessage,
error: errorInSendingMessage
});
}
</script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="~/content/js/vendor/jquery-1.9.0.min.js"><\/script>')</script>
<script src="/content/js/plugins.js"></script>
<script src="/content/js/main.js"></script>
<!-- Google Analytics: change UA-XXXXX-X to be your site's ID. -->
<script type="text/javascript">
var _gaq = [['_setAccount', 'UA-XXXXX-X'], ['_trackPageview']];
(function (d, t) {
var g = d.createElement(t), s = d.getElementsByTagName(t)[0];
g.src = ('https:' == location.protocol ? '//ssl' : '//www') + '.google-analytics.com/ga.js';
s.parentNode.insertBefore(g, s);
}(document, 'script'));
</script>
</body>
</html>
そしてこれが私のモデルです。
public class UserMessage
{
[Required(AllowEmptyStrings = false,ErrorMessage = "Email address required.")]
[DataType(DataType.EmailAddress, ErrorMessage = "Invalid Email Address")]
[Display(Name = "Email Address:")]
public string Email { get; set; }
[AllowHtml]
[Display(Name = "Comments:")]
public string Message { get; set; }
}