客户端验证在我的MVC3应用程序中不起作用

时间:2013-02-25 14:52:15

标签: jquery asp.net-mvc-3 jquery-ui

我正在尝试在我的一个视图中为电子邮件字段进行验证。

但不幸的是它没有用。有人可以帮助我。

这是我的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; }
}

1 个答案:

答案 0 :(得分:0)

我认为您只需要添加[电子邮件地址]验证属性。

[数据类型]实际上没有进行验证。认为它只是添加了HTML输入类型属性。

[Required(AllowEmptyStrings = false, ErrorMessage = "Email address required.")]
[DataType(DataType.EmailAddress)]
[EmailAddress]
[Display(Name = "Email Address:")]
public string Email { get; set; }