.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 > 10)

            {

                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个小时，崩溃！