2017-07-27 55 views
0

,我創建了一個模態的,在登錄用戶的點擊,如果用戶名或密碼不正確返回SignInStatus.Failure這是確定的,但 刷新頁面,並我有隻「3」在頁面頂部的頁面沒有任何想從JSON回報只顯示值不顯示登陸用戶數據

,但我想顯示在登錄模式窗體前的頂部= "user name or password is not correct"消息,

enter image description here

我在

[HttpPost] 
[AllowAnonymous] 
[ValidateAntiForgeryToken] 
public async Task<ActionResult> _LoginPopup(LoginViewModel model, string returnUrl) 
{ 
    if (!ModelState.IsValid) 
    { 
     return PartialView("ModalPopUp"); 
    } 

    // This doesn't count login failures towards account lockout 
    // To enable password failures to trigger account lockout, change to shouldLockout: true 
    var result = await SignInManager.PasswordSignInAsync(model.Email, model.Password, model.RememberMe, shouldLockout: false); 
    switch (result) 
    { 
     case SignInStatus.Success: 
      MigrateShoppingCart(model.Email); 
      return RedirectToLocal(returnUrl); 
     case SignInStatus.LockedOut: 
      return View("Lockout"); 
     case SignInStatus.RequiresVerification: 
      return RedirectToAction("SendCode", new { ReturnUrl = returnUrl, RememberMe = model.RememberMe }); 
     case SignInStatus.Failure: 
     default: 
      ModelState.AddModelError("", "Invalid login attempt."); 
      return Json(SignInStatus.Failure, JsonRequestBehavior.AllowGet); 
    } 
} 

和我的模型局部視圖代碼

@using (Html.BeginForm("_LoginPopup", "Account", new { ReturnUrl = ViewBag.ReturnUrl }, FormMethod.Post, new { @class = "form-horizontal", role = "form" })) 
     { 
       @Html.AntiForgeryToken() 
      <div id="failorLogin"></div> 
       @Html.ValidationSummary(true, "", new { @class = "text-danger" }) 
       <div class="form-group"> 
        <div class="col-md-12"> 
         @Html.TextBoxFor(m => m.Email, new { @class = "form-control", placeholder = "Email" }) 
         @Html.ValidationMessageFor(m => m.Email, "", new { @class = "text-danger" }) 
        </div> 
       </div> 
       <div class="form-group"> 
        <div class="col-md-12"> 
         @Html.PasswordFor(m => m.Password, new { @class = "form-control", placeholder = "password" }) 
         @Html.ValidationMessageFor(m => m.Password, "", new { @class = "text-danger" }) 
        </div> 
       </div> 
       <div class="form-group"> 
        @Html.LabelFor(model => model.RememberMe, htmlAttributes: new { @class = "control-label col-md-8" }) 
        <div class="col-md-4"> 
         <div class="checkbox"> 
          @Html.EditorFor(model => model.RememberMe) 
          @Html.ValidationMessageFor(model => model.RememberMe, "", new { @class = "text-danger" }) 
         </div> 
        </div> 
       </div> 
       <div class="form-group"> 
        <div class="pull-right col-md-3"> 
         <input type="submit" id="btnLogin" value="Login" class="btn btn-default" style="background-color:#5d1338;color:white" /> 
        </div> 
       </div> 

      } 

和Ajax代碼爲

$("#btnLogin").click(function (e) { 
    e.defaultPrevented(); 
    $.ajax({ 
     url: '@Url.Action("../Account/_LoginPopup")', 
     contentType: "application/json; charset=utf-8", 
     dataType: 'json', 
     type: "POST", 
     data: { 
      model:model, 
      "__RequestVerificationToken": 
       $("input[name=__RequestVerificationToken]").val() 
     }, 
     success: function(data) { 

      alert(data); 

     } 
    }); 
}); 

回答

0

的問題是因爲雖然你讓AJAX請求,<form>元素提交仍在進行中。這反過來取消了AJAX請求(因爲頁面被卸載),然後重定向到部分視圖。這就是爲什麼你在頁面中看到唯一的3

要解決此問題,您掛鉤事件到<form>元素的submit和呼叫preventDefault(),像這樣:

$("form").submit(function(e) { 
    e.preventDefault(); 
    $.ajax({ 
    url: this.action, 
    type: this.method, 
    contentType: "application/json; charset=utf-8", 
    dataType: 'json', 
    data: { 
     model: model, 
     "__RequestVerificationToken": $("input[name=__RequestVerificationToken]").val() 
    }, 
    success: function(data) { 
     alert(data); 
    } 
    }); 
}); 

請注意,我用form這裏選擇,但我建議你使用您的生產代碼中更具體的東西。例如,一個id選擇器。

另請注意,您已指定dataType: 'json',但Action的大部分邏輯結果都會導致HTML響應。