MVCのjsonオブジェクトを含むビューを返す

Question

私はMVCコントローラにユーザをログインさせるメソッドを持っています。私はJson Objectを返す必要があるので、成功すると別のアクション（検索アクション）にリダイレクトする必要があります。それ以外の場合は同じページになり、ログイン失敗メッセージが表示されます。私の見解で

[HttpPost] 
    [Route("login")] 
    public JsonResult Login(LogInRequest logInRequest) 
    { 
     LogInResponse response = new LogInResponse(); 
     response.ReturnUrl = Url.Action ("Search", "ContreollerName");    
try 
     { 
      if (ModelState.IsValid) 
      { 
       ..... 
       if (logInRequest.UserName == "test") 
       { 
        response.IsSuccessfull = true; 
       } 
       else 
       { 
        response.IsSuccessfull = false; 
        response.ErrorDescription = MessageStrings.IncorrectUserName; 
       } 
      } 
     } 
     catch (Exception exception) 
     { 
      response.ErrorDescription = MessageStrings.ServerError; 
      response.IsSuccessfull = false; 
     } 
     return Json(response, JsonRequestBehavior.AllowGet); 
    } 

    [Route("Search")] 
    public ActionResult Search() 
    { 
    ...... 
     return View(); 
    } 

： これは、コントローラのコードで、私はそれではなく、ビューのJSONオブジェクトを返してみてください

@model CarFinance.Garage.Web.Models.LogInRequest 
<script src="~/Scripts/Login/login.js"></script> 
@using (Html.BeginForm("Login", "ContreollerName", FormMethod.Post)) 
{ 
    @Html.AntiForgeryToken() 
     <table> 
     <tr> 
      <td><label>UserName:</label></td> 
      <td> 
       <input name="UserName" type="text" placeholder="UserName" title="UserName" class="span_12" /> 
      </td> 
     </tr> 
     <tr> 
      <td><label>Password:</label></td> 
      <td> 
       <input name="Password" type="password" placeholder="Password" title="password" class="span_12" /> 
      </td> 
     </tr> 
     <tr> 
      <td colspan="2"><input id="btnLogin" type="submit" value="Log In" /></td> 
     </tr> 
    </table> 
} 

何でも、私はjqueryのではなく、まだそれをいくつかのコードを入れてみてください私はjqueryの中でいくつかのコードを持ってしてみてくださいそれでも、それはではないだろう

{ 
ReturnUrl: "/Search", 
IsSuccessfull: true, 
ErrorDescription: 
ValidationErrors: [ ] 
} 

：

でもjqueryのメソッドに、ちょうどこのような画面が表示されません。

$("#btnLogin").click(function() { 
alert("test"); 

.......

Answer 1

ログイン方法はJSONデータを返します。したがって、応答jsonを解析し、IsSuccessfulプロパティ値に基づいて、新しいURLにリダイレクト

あなたのフォームがajaxを介して送信されていることを確認する必要があります。 jQuery serializeメソッドを$.postとともに使用すると、そうすることができます。

$(function(){ 

    //Listen to the form submit event 
    $("form").submit(function(e){ 
     // Prevent the default form submit behavior since we are doing ajax submit 
     e.preventDefault(); 

     //Get the url to which form should be submitted 
     var url =$(this).closest("form").attr("action"); 
     //do an ajax post with serialized for data 

     $.post(url,$(this).closest("form").serialize(),function(response){ 
      //Check the response and do needful. 
      if(response.IsSuccessfull) 
      { 
      window.location.href=response.ReturnUrl; 
      } 
      else 
      { 
      alert("Login failed"); 
      } 
     }); 

    }); 
}); 

これは、フォームが提出ハイジャックし、あなたのページにはJSのエラーが存在していないjsの他のコードを持っていないと仮定すると動作するはずです。