在做用户注册的时候,常常会验证用户名是否已经存在数据库中,
第一步引入相关的js:
<script src="~/Scripts/jquery.validate.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.js"></script>
第二步前台表单
这里需要注意的是,你需要使用注解Remote去校验某个字段时,一定需要使用
@Html.TextBoxFor(model => model.UserName, new { @placeholder = " 不少于4个字符", @class= "InputTR" })
这种方式
不能使用下面这种
<input class="InputTR" name="UserName" placeholder=" 需要通过邮件激活账户" value="@(Model != null ? Model.UserName: "")",
如果使用下面这种方式,你将断点都进不去remote定义的校验的方法
@using (Html.BeginForm("RegisterUser", "Register")) { <table style=" width:100%; border-collapse:separate; border-spacing:0px 20px; "> <tr> <td class="RegisterTd">邮箱</td> <td><input class="InputTR" name="Email" placeholder=" 需要通过邮件激活账户" value="@(Model != null ? Model.Email : "")" /></td> </tr> <tr><td></td><td style="color:red">@Html.ValidationMessageFor(m => m.Email)</td></tr> <tr> <td class="RegisterTd">用户名</td> <td>@Html.TextBoxFor(model => model.UserName, new { @placeholder = " 不少于4个字符", @class= "InputTR" })</td> </tr> <tr><td></td><td style="color:red">@Html.ValidationMessageFor(m => m.UserName)</td></tr> <tr> <td class="RegisterTd">显示昵称</td> <td>@Html.TextBoxFor(model => model.ShowUserName, new { @placeholder = " 不少于4个字符", @class = "InputTR" })</td> </tr> <tr><td></td><td style="color:red">@Html.ValidationMessageFor(m => m.ShowUserName)</td></tr> <tr> <td class="RegisterTd">密码</td> <td><input type="password" class="InputTR" name="PassWord" placeholder=" 至少8位,并包含字母、数字和特殊字符中的两种" value="@(Model != null ? Model.PassWord : "")" /></td> <td></td> </tr> <tr><td></td><td style="color:red">@Html.ValidationMessageFor(m => m.PassWord)</td></tr> <tr> <td class="RegisterTd">确认密码</td> <td><input type="password" class="InputTR" name="ConfirmPwd" placeholder=" 请输入确认密码" value="@(Model != null ? Model.ConfirmPwd : "")" /></td> </tr> <tr> <td></td><td style="color:red">@Html.ValidationMessageFor(m => m.ConfirmPwd)</td></tr> <tr> <td></td> <td><input type="submit" style="width:100px; height:30px; background-color:#00CCFF;border:0;letter-spacing:10px; color:#fff;" value="注册" /></td> </tr> </table> }
实体类代码
using System; using System.Collections.Generic; using System.ComponentModel.DataAnnotations; using System.Linq; using System.Web; using System.Web.Mvc; namespace PicManager.Models { public class User { [Key] public int UserId { get; set; } [Required(ErrorMessage ="用户名不能为空")] [MinLength(4,ErrorMessage ="至少4个字符")] [Remote("IsHaveUName", "Register", ErrorMessage ="用户名已存在", HttpMethod = "POST")] public string UserName { get; set; } [Required(ErrorMessage ="昵称不能为空")] [MinLength(4,ErrorMessage ="至少4个字符")] [Remote("IsHaveSName", "Register", ErrorMessage = "昵称已存在",HttpMethod ="POST")] public string ShowUserName { get; set; } [Required(ErrorMessage ="密码不能为空")] [RegularExpression(@"^(?=.*[a-zA-Z])(?=.*\d)(?=.*[#@!~%^&*.])[a-zA-Z\d#@!~%^&*.]{8,}$",ErrorMessage ="密码不符合要求")] public string PassWord { get; set; } [Required(ErrorMessage ="确认密码不能为空")] [System.ComponentModel.DataAnnotations.Compare("PassWord",ErrorMessage ="两次密码输入不一致")] public string ConfirmPwd { get; set; } [Required(ErrorMessage ="邮箱不能为空")] [RegularExpression(@"[A-Za-z0-9._%+-]+@[A-Za-z0-9.-]+\.[A-Za-z]{2,4}",ErrorMessage ="邮箱格式不正确")] public string Email { get; set; } public int Status { get; set; } public string Code { get; set; } public DateTime CreatTime{ get; set; } } }
remote定义的方法
[OutputCache(Location = OutputCacheLocation.None, NoStore = true)]//加上清除缓存 public ActionResult IsHaveUName(string UserName) { var query = from u in db.User where u.UserName == UserName select u; if (query.Count()>0) { return Json(false, JsonRequestBehavior.AllowGet); } return Json(true, JsonRequestBehavior.AllowGet); } [OutputCache(Location = OutputCacheLocation.None, NoStore = true)]//加上清除缓存 public ActionResult IsHaveSName(string ShowUserName) { var query = from u in db.User where u.ShowUserName == ShowUserName select u; if (query.Count() > 0) { return Json(false, JsonRequestBehavior.AllowGet); } return Json(true, JsonRequestBehavior.AllowGet); }