首先是同mvc ajax框架

引入jquery.unobtrusive-ajax.js

原本mvc表單提交的html擴充套件方法是 Html.BeginForm, 現在用Ajax.BeginForm

登入介面：

 @using (Ajax.BeginForm("Login_Ajax", "Login", new AjaxOptions { HttpMethod = "post", OnSuccess = "back" }, new { id = "from" }))
        {
            <div class="mycenter">
                <div class
 
="mysign">
                    <div class="col-lg-11 text-center text-info">
                        <h2>
                            請登入
                        </h2>
                    </div>
                    <div class="col-lg-10">
                        <input type="
 
text" class="form-control" name="UserEmail" placeholder="請輸入郵箱" />
                        <span style="color:red">@Html.ValidationMessageFor(i => i.UserEmail)</span>
                    </div>
                    <div class="col-lg-10">
                    </div>
                    <div class
 
="col-lg-10">
                        <input type="password" class="form-control" name="UserPwd" placeholder="請輸入密碼" />
                        <span style="color:red">@Html.ValidationMessageFor(i => i.UserPwd)</span>
                    </div>
                    <div class="col-lg-10">
                    </div>
                    <div class="col-lg-10">
                        <button type="submit" id="btn" class="btn btn-success col-lg-12">
                            登入
                        </button>
                    </div>
                    <div class="col-lg-10">
                    </div>

                    <div class="col-lg-10">
                        @*<a href="" style="float:left" >註冊賬號</a><a href="" style="float:right">註冊賬號</a>*@
                        <button type="button" id="btnbtn" class="btn btn-success col-lg-12" onclick="a()">
                            註冊賬戶
                        </button>
                    </div>
                </div>
            </div>
        }
        </div>

然後是js back方法 這是請求成功時返回的函式 ------- 回撥函式

function back(data) {
            if (data.Status == 0) {
                alert(data.Msg);
                return;
            }
            if (data.Status == 1) {
                alert(data.Msg);
                window.location.href = "/Home/Index";
            }
        }

然後寫一個ajax類，裡面有兩個屬性，一個是狀態 一個是訊息

 public class Ajax
    {
        //提示資訊
        public string Msg { get; set; }
        //狀態 0失敗   1成功
        public int Status { get; set; }
    }

然後是contorllers下新增 Login_Ajax的action

  public ActionResult Login_Ajax(UserLogin user)
        {
            if (!ModelState.IsValid)
            {
                return RedirectToAction("Login");
            }
            else
            {
                var User= db.Query<LoginUser>(i => i.UserEmail == user.UserEmail && i.UserPwd == user.UserPwd);
                if (LoginUserPwd(user.UserEmail,user.UserPwd))
                {
                    user.UserName = User.UserName;
                    SessionHelp.SessionHelpe.SetSession("user", user.UserName);
                    Ajax ajax = new Ajax() { Status = 1, Msg = "登入成功" };
                    return Json(ajax);  
                }
                else
                {
                    Ajax ajax = new Ajax() { Status = 0, Msg = "賬號或密碼錯誤！" };
                    return Json(ajax);                 
                }
            }
        }



//判斷賬號密碼是否正確
 public bool LoginUserPwd(string UserEmail,string UserPwd)
        {
            var user = db.Query<LoginUser>(i => i.UserEmail == UserEmail && i.UserPwd == UserPwd);
            if (user==null)
            {
                return false;
            }
            else
            {
                return true;
            }
        }