.NET MV4 Remote远程验证注意事项及案例

首先是模型代码

public class LoginModel
    {
        [Required]
        [Display(Name = "用户名")]
        [Remote("CheckName", "Account", ErrorMessage = "用户测试")]
        public string UserName { get; set; }

        [Required]
        [DataType(DataType.Password)]
        [Display(Name = "密码")]
        public string Password { get; set; }

        [Required]
        [Display(Name = "验证码")]
        //[Remote("CheckValidateCode", "Account", ErrorMessage = "验证码输出错误")]
        [Editable(true)]
        public string ValidateNumber { get; set; }
    }

控制器：

       [HttpGet]
        [AllowAnonymous]
        [OutputCache(Location = System.Web.UI.OutputCacheLocation.None, NoStore = true)]   //清除缓存
        public JsonResult CheckName(string UserName)
        {

            if (UserName.Length > )
            {
                return Json(true, JsonRequestBehavior.AllowGet);

            }
            else
            {
                return Json("输入太短", JsonRequestBehavior.AllowGet);
            }
        }  

视图页

@model UMoney.Site.Models.LoginModel
@{
    ViewBag.Title = "";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<h2>Login</h2>
@using (Html.BeginForm(new { ReturnUrl = ViewBag.ReturnUrl })) {
    @Html.AntiForgeryToken()
  @Html.ValidationSummary(true)
    <fieldset>
        <legend>“登录”表单</legend>
        <ol>             <li>
                @Html.LabelFor(m => m.ValidateNumber)
                @Html.EditorFor(m => m.ValidateNumber)
                <img id="valiCode" style="cursor: pointer;" src="/Account/GetValidateCode" alt="验证码" onClick="javascript:this.src='/Account/GetValidateCode?'+ Math.random()" />  

                @Html.ValidationMessageFor(m => m.ValidateNumber)
            </li>
            <li>
                @Html.LabelFor(m => m.UserName)
                @Html.EditorFor(m => m.UserName)
                @Html.ValidationMessageFor(m => m.UserName)
            </li>
            <li>
                @Html.LabelFor(m => m.Password)
                @Html.PasswordFor(m => m.Password)
                @Html.ValidationMessageFor(m => m.Password)
            </li>

        </ol>
        <input type="submit" value="登录" />
    </fieldset>
    <p>
        @Html.ActionLink("Register", "Register") (如果你没有帐户)。
    </p>
}
 @Scripts.Render("~/bundles/jquery")

 @Scripts.Render("~/bundles/jqueryval")

需要注意的是

@Scripts.Render("~/bundles/jquery")
   
@Scripts.Render("~/bundles/jqueryval")

引用的 JS绑定文件顺序不能颠倒

如果
 @Scripts.Render("~/bundles/jqueryval")

@Scripts.Render("~/bundles/jquery")

这样，romote 远程验证将会失效。

这是页面生成的代码

<script src="/Scripts/jquery-1.4.4.js"></script>

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

不能颠倒的原因也是     jquery验证文件

<script src="/Scripts/jquery.unobtrusive-ajax.js"></script>

<script src="/Scripts/jquery.validate.js"></script>

<script src="/Scripts/jquery.validate.unobtrusive.js"></script>

不能先于 jquery主文件进行导入

<script src="/Scripts/jquery-1.4.4.js"></script>

<script src="/Scripts/jquery-1.7.1.js"></script>

所以一定要注意导入顺序，我就是没注意这个问题，折腾了2个小时，崩溃！