jquery ajax dosen't在asp.net工作mvc

我有一個項目是使用引導莫代爾作爲登錄部分視圖，但我想有一個異步解決方案來驗證用戶登錄，所以通過jquery.post傳遞數據行動和，但我發現那裏jquery.post成功完成但沒有行動的迴應。jquery ajax dosen't在asp.net工作mvc

查看：

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">  
    <div class="modal-dialog"> 
     <div class="modal-content"> 
      <div class="modal-header"> 
       <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> 
       <h4 class="modal-title" id="myModalLabel">Login </h4> 
      </div> 
      <div class="container"> 
       <div class="modal-body" id="signinForm"> 
        @using (Ajax.BeginForm("Login", "Account", new AjaxOptions { HttpMethod = "POST", UpdateTargetId = "signinForm" }, new { @id = "targetForm" })) 
        {  
         // Html.BeginForm("Login", "Account", FormMethod.Post, new { @id = "signinForm" }); 

         @Html.ValidationSummary(true, "Account creation was unsuccessful. Please correct the errors and try again.") 
         <div id="errorresult"></div> 
         <div class="control-group"> 
          <label class="control-label" for="inputEmail">User Name</label> 
          <div class="controls"> 
           @Html.TextBoxFor(m => m.UserName, new { @name = "inputUser", @class = "form-control", @id = "inputUser", @placeholder = "User Name" }) 
           @Html.ValidationMessageFor(m => m.UserName) 
          </div> 
         </div> 
         <div class="control-group"> 
          <label class="control-label" for="inputPassword">Password</label> 
          <div class="controls"> 
           @Html.TextBoxFor(m => m.Password, new { @name = "inputPassword", @class = "form-control", @id = "inputPassword", @placeholder = "Password", @type = "password" }) 
           @Html.ValidationMessageFor(m => m.Password) 
          </div> 
         </div> 
         <div class="control-group"> 
          <div class="controls"> 
           <label class="checkbox"> 
            Remember me @Html.CheckBoxFor(m => m.RememberMe, new {@id="rememberMe"}) 
            <span class="span9">@Html.ActionLink("Register", "Register", "Account") </span> 
           </label> 
           <button type="submit" id="submit_btn" class="btn btn-primary">sign in</button> 

          </div> 
         </div>        
        }  
       </div> 
      </div> 
     </div> 
     <!-- /.modal-content --> 
    </div> 
    <!-- /.modal-dialog --> 
</div>

的Javascript：

$('#submit_btn').click(function (event) { 
    event.preventDefault(); 
    var targetForm = $('#targetForm').serialize(); 
     var newtargetForm= targetForm.replace(/&/g, "?"); 
     $.post("@Url.Action("AjaxLogin", "Account")?"+ newtargetForm, { 
      userName: $('#targetForm #inputUser').val(), 
      passWord: $('#targetForm #inputPassword').val(), 
      rememberMe:$('#targetForm #rememberMe').is(':checked') 
     }, function (data, textStatus, xhr) { 
      /*optional stuff to do after success */ 
      console.log(textStatus); 
     })  
    })

我的行動：

[HttpPost] 
public ActionResult AjaxLogin(string UserName, string Password, bool RememberMe) 
{ 
    if (ModelState.IsValid) 
    { 
     if (Membership.ValidateUser(UserName,Password)) 
     { 
      FormsAuthentication.SetAuthCookie(UserName, RememberMe); 
      return RedirectToAction("BlogPost","Blog"); 
     } 
    } 
    return PartialView("Login"); 
}

從我的理解，asp.net mvc的途徑規則應該工作，但它沒」噸。

來源

2014-02-20 robin521

你的瀏覽器控制檯說什麼？ – Shyju

console.log（textStatus）;說「成功」 – robin521

我會啓動FireBug，看看會發生什麼。我不認爲你可以/應該像這樣混合使用jQuery和MVC Ajax。我沒有使用過MS Ajax的東西，但看起來他們都試圖同時處理同一個提交。 – Chris

問題：

type="submit"導致Web瀏覽器通過回發到提交表單（因爲你method屬性被設置爲「POST」），這會導致頁面刷新。發生這種情況時，頁面上的所有JavaScript都將終止，因爲您正在切換到其他頁面或重新加載當前頁面。

被盜從Ajax call doesn't work when a submit button is used

解決方案：

更改
<button type="submit" id="submit_btn">
到
<button type="button" id="submit_btn">

而且保持代碼的其餘部分，因爲它是。

來源

2014-02-20 04:46:55

我認爲沒有問題，因爲他使用了'event.preventDefault（）;' –

是的，event.preventDefault（）可以忽略提交動作 – robin521

jquery ajax dosen't在asp.net工作mvc

回答

相關問題