Я хочу войти в систему с помощью вызова ajax с помощью html формы начала в MVC с обратным URL

Question

Я хочу войти в систему с помощью вызова ajax, используя HTML и начинаю формироваться в MVC с возвращаемым URL. Как я могу решить это? Моя страница обновляется. Я не хочу перезагружать ее при перенаправлении на другую страницу. Я не могу остановить обновление страницы после вызова ajax. Я попытался, поставив e.preventDefault (), и вернуть false; но, опять же, моя страница обновляется. вот мой вызов ajax

<script>
   $('.btnUrl').click(function (e) {

               debugger
               e.preventDefault();
               //collect the user data
               var data = {};
               data.UserName = $("#username").val();
               data.Password = $("#password").val();
               var token = $('input[name="__RequestVerificationToken"]').val();
               //var url = $('.btnUrl').data('url');
               $.ajax({
                   url: "/Account/Login",
                   method: "POST",
                   data: {
                       model: data,
                       __RequestVerificationToken: token,
                       returnUrl: "Home/Index"   // you can modify the returnUrl value here
                   },
                   success: function (data) {
                       debugger
                       if (data.Success) {

                           window.location.href = "@Url.Action("Index" ,"Home")";
                       }
                       else {

                           window.location.href = "@Url.Action("Login" ,"Account")";
                       }
                   }
                   });
           });

       </script>

метод моего действия

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

            // 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.UserName, model.Password, model.RememberMe, shouldLockout: false);
            switch (result)
            {
                case SignInStatus.Success:
                   // return RedirectToLocal(returnUrl);
                return Json(new { Success = true, Url = "/Home/Index" });

                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(new { Success = false, Url = "/Account/Login" });
                    //return View(model);
                    //return RedirectToAction("Index", "Home");
            }

        }

Answer 1

Ваш код обрабатывает событие нажатия кнопки. Вам нужно обработать событие отправки формы и использовать e.preventDefault(); для его отмены.

Вместо того, чтобы:

$('.btnUrl').click(function (e) { //Your ajax code })

Попробуйте использовать:

$('#yourForm').submit(function (e) { //Your ajax code e.preventDefault(); })

Answer 2

Вы используете window.location.href = "@Url.Action("Index" ,"Home")"; в вашем ajax успехе, который перезагружает всю страницу. Если вы не хотите перезагружать страницу, тогда ajax успешно вернет частичное представление с вашего контроллера. Как это

success: function (partialViewData) {
           $('body').html(partialViewData); // change where ever you want to place the view
          }