MVC3学习：利用mvc3+ajax检测用户是否被注册

假设用户名是保存在表Users中。关系模式为Users(Uid,UserName,PassWord)

可先利用mvc自带的模板生成Create页面。

将填写用户名的地方，由原来的

 <div class="editor-field">

            @Html.EditorFor(model => model.UserName)

           @Html.ValidationMessageFor(model => model.UserName)

        </div>

变为

 <div class="editor-field">

            @Html.EditorFor(model => model.UserName)

            <a id="usn" href="#" >检测该用户是否可用</a>

            <label id="msg" style="color:Red"></label>

           @Html.ValidationMessageFor(model => model.UserName)

        </div>

即增加一个检测按钮和一个显示结果的label.

在此页面上增加JQuery ajax:

<script type="text/javascript">

    $(function () {

        $("#usn").click(function () {

            var username = $("#UserName").val();

            if (username == "") { alert("请输入您要注册的用户名"); return false; }

            else {

                $.post("IsExistUsn", { usn: username },

                function (data) {

                    if (data == "-1") { $("#msg").text("很遗憾，该用户已经被注册！"); return false; }

                    else { $("#msg").text("恭喜您，该用户还未被注册！"); return false; }

                });

            }

        });

    });

</script>

 

控制器端代码：

   public ActionResult Create()

        {

            return View();

        }

        public ActionResult IsExistUsn(string usn)

        {



            try

            {

                if (Request.IsAjaxRequest())

                {

                    int n = db.Users.Where(c => c.UserName == usn).Count();

                    if (n != 0)

                        return Content("-1");

                    else

                        return Content(n.ToString());

                }

                else

                    return Content("-1");

            }

            catch

            {

                return Content("-1");

            }

        }

View Code

Create方法用于生成注册页面，IsExistUsn方法用于判断用户是否存在。与ajax里面的url要一致。