Redirect to MVC view with model from $http post service

Question

Hello I am actually new to MVC and i stuck with a problem. I tried and searched everywhere but the problem remain unsolved .

I am sending a model using $http post to a MVC action and to the view . The data is successfully send over the action and view but the url isn't redirecting to the target view also in my case i want to send a model along with redirection .(I can perform redirection with windows.location.href="success" after $http.success but i can't send model data doing that)

Here is my sample try.(here i am providing user name as "random," and password as "randPassword" and i am sending a sample data(Name) to success view.

JS

var config = {
        headers: {
            'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8;'
        }
    }


   var data = $.param({

        UserName: $scope.user.username,
        Password: $scope.user.password,

    });

    $http.post('Login', data, config).success(function (data, status, headers, config) {

    }).then(function () {
        console.log(data);

    });

C# Action

[HttpPost]
[AllowAnonymous]
public ActionResult Login(LoginModel usr)
{      
        if (usr.UserName=="random"&&usr.Password=="randPassword")
        {

            Session["Username"] = usr.UserName.ToString();
            FormsAuthentication.SetAuthCookie(user.UserName, false);
           return RedirectToAction("Success","Account",new {new {Name=usr.UserName}});
        }
        else
        {
            ModelState.AddModelError("", "UserName or Password is Wrong");
            return View();
        }

}

My success view is simple view with only success . The debug will continue to view on break-point too but without redirection . I can redirect with js after success but is things get complex when i want to send data and render a view . Thanks !!

As you are sending async request return value with return to success of $http call and wont redirect to action or return any view. To redirect or to show data on your view you will need to write logic in success call of $http. — Nitin Varpe, Jan 06 '16 at 05:13
are you talking about window.location.href . That will redirect to my view but the thing get complex when i want to redirect to a view with some model data . — user5630511, Jan 06 '16 at 05:16
Yup, Please check what response you are getting in success call of http. I think you should return json from action and use that to redirect or to update view. — Nitin Varpe, Jan 06 '16 at 05:19

score 0 · Answer 1 · answered Jan 06 '16 at 05:24

0

The control is with the ajax call so the redirection is actually happening from server side and is returned to the ajax caller in javascript. Try submitting the form from the page, the redirection would happen on browser.

answered Jan 06 '16 at 05:24

Sunil Sistla

66
5

score -1 · Answer 2 · edited May 23 '17 at 12:33

Since it is an ajax call you are making, you should return a a json response from your action method.

[HttpPost]
[AllowAnonymous]
public ActionResult Login(LoginModel usr)
{      
    if (usr.UserName=="random"&&usr.Password=="randPassword")
    {
        // do whatever you have to do 
        return Json(new { status="success"});
    }
    else
    {
      return Json(new { status="error" ,error= "UserName or Password is Wrong"});
    }
}

And in your $http.post call's then event, check the response coming back and does the redirection.

var loginUrl="@Url.Action("Login","Account")";

$http.post(loginUrl, data, config).then(function(res){
    if(res.data.status==="success")
    {
       window.location.href="@Url.Action("Success","Account")";
    }
    else
    {
      alert(res.data.error);
    }
});

The above javacript code assumes that your have it in your razor view and making use of the Url.Action helper method to generated the relative url to the action method. If your angular code is in a seperate javascript file, You may pass the url to the app root from your razor view and use that to build the url to your action method as explained in this answer.

Redirect to MVC view with model from $http post service

2 Answers2