Knockoutjs ne pouvait pas aller à la vue RedirectToAction

Question

Je simple contrôleur de connexion:

public ActionResult Login() 
{ 
    return View(); 
} 

[HttpPost] 
public ActionResult Login(string userName, string passWord) 
{ 
    if (ModelState.IsValid) 
    { 
     var employee = 
     db.Employees.FirstOrDefault(x => x.EmployeeNo == userName && x.Password == passWord && x.StatId == 1); 

     if (employee != null) 
     { 
      return RedirectToAction("Index"); 
     } 

    } 

    return View(); 
} 


public ActionResult Index() 
{ 
    return View(db.Employees.ToList()); 
} 

Ceci est mon avis qui est lié à un fichier knockoutjs:

@model SimpleLogin.Models.Employee 

@{ 
    ViewBag.Title = "Login"; 
    Layout = "~/Views/Shared/_Layout.cshtml"; 
} 

<h2>Login</h2> 

<span>User</span> &nbsp; <span data-bind="text: userName"></span> <br/> 
<span>Password</span> &nbsp; <span data-bind="text: passWord"></span> 
<div> 
    <table> 
     <tr> 
      <td> 
       <input type="text" name="txtUserName" placeholder="User Name" data-bind="value: userName" /></td> 
     </tr> 
     <tr> 
      <td> 
       <input type="password" name="txtPassword" placeholder="Password" data-bind="value: passWord"/></td> 
     </tr> 
    </table> 

    <button data-bind="click: logUser">Login</button> 
</div> 


@section Scripts 
    { 
    @Scripts.Render("~/bundles/jquery") 
    @Scripts.Render("~/bundles/knockout") 
    @Scripts.Render("~/Knocks/LoginVm.js") 
} 

c'est mon LoginVm knock-out. js

$(function() { 
    ko.applyBindings(LoginVm); 
}); 

var LoginVm = { 
    userName: ko.observable(''), 
    passWord: ko.observable(''), 

    logUser: function() { 
     var self = this; 

     $.ajax({ 
      url: '/Company/Login', 
      type: 'post', 
      dataType: 'json', 
      data: ko.toJSON(self), 
      contentType: 'application/json', 
      success: function(data) { 
       //window.location.href = '/Company/Index'; //I tried putting an alert here but doesn't work. why? 
      } 
     }); 
    } 
}; 

Quand je courais l'application, je mets un point de rupture dans le « si (ModelState.IsValid) » du contrôleur. Cela a bien fonctionné. Il a même exécuté le "return RedirectToAction (" Index ")" mais le problème est, la page reste dans la vue de connexion et n'a jamais chargé la vue d'index. Pourquoi? Qu'ai-je fait de mal?

Je mets également ceci:

bundles.Add(new ScriptBundle("~/bundles/knockout").Include(
         "~/Scripts/knockout-2.1.0.js", 
         "~/Scripts/knockout-2.1.0.debug.js")); 

dans les BundleConfig.cs

Je ne suis pas habitué à js, il me confond vraiment. Je sais qu'il y a plus de 2 erreurs dans ce que j'ai fait.

c'est ma classe

public class Employee{ 
public int EmployeeId {get; set;} 
public string UserName {get; set} 
public string Password {get; set;} 
} 

Answer 1

Vous ne pouvez pas return View à une demande ajax. Vous devez le changer pour:

public ActionResult Login(string userName, string passWord) 
{ 
    if (ModelState.IsValid) 
    { 
     var employee = 
     db.Employees.FirstOrDefault(x => x.EmployeeNo == userName && x.Password == passWord && x.StatId == 1); 

     if (employee != null) 
     { 
      return Json(true); 
     } 
    } 

    return Json(false); 
} 

Puis dans votre js:

$.ajax({ 
     url: '/Company/Login', 
     type: 'post', 
     dataType: 'json', 
     data: ko.toJSON(self), 
     contentType: 'application/json', 
     success: function(data) { 
      if(data) { 
       window.location.href = '@Url.Action("Index", "Company")'; 
      } 
     } 
    }); 

Mais il n'y a pas besoin d'utiliser knock-out ici. Vous pouvez simplement faire un formulaire normal Submit et rediriger par return RedirectToAction("Index", "Company") dans le contrôleur.