MVC controller method not receiving json data from $http post

Question

This might be basic question but I couldn't find where the issue is. I am using .Net Core for by back end and angularJS for front end. below is my code.

HTML

<div ng-controller="loginController">
<input type="text" ng-model="email"><br />
<input type="text" ng-model="password"><br />
<input type="submit" ng-click="login()">
</div>

AngularJS Code

app.controller('loginController',['$scope','$http', function (scope, http) {

scope.login = function () {
    var req = {
        method: 'POST',
        url: '/Account/loginInfo',
        data: { email: scope.email, password: scope.password },
        headers: {
            "Content-Type": "application/json"
        }
    }
    http(req)

        .then(function successCallback(response) {

        }, function errorCallback(response) {

        });
};
}]);

Back end c#

[HttpPost]
public JsonResult loginInfo(string email, string password)
{
  //do something here
}

When I debug this I can see that payload is having the email and password values but anyhow they are not getting passed to the controller method. I can see that controller method is being hit but the values show as null.

things I have tried:

Setting the content type to "application/x-www-form-urlencoded"
Passing the data as Json object
Converting scope values to string

None of them seem to be working. anyone faced this kind of issue or expert opinion please.

Followed this post Angular JS Not Sending Data To Web Api . didn't quite get the approved answer or it is not related to my issue.

You have to use the [FromBody] attribute on your parameters e.g. loginInfo([FromBody]string email, [FromBody]string password) — Brad
– Brad, Commented May 27, 2018 at 1:53
Have you tried it with a model parameter? e.g. loginInfo([FromBody]Credentials creds) — Brad
– Brad, Commented May 27, 2018 at 2:01
@Brad That worked!!! so any request from angular $http should be picked up as [FromBody] on the server side? can you please explain, that would be appreciated. Thank you. — krishna chaitanya
– krishna chaitanya, Commented May 27, 2018 at 2:09
In ASP.NET Core MVC the default content type is application/x-www-form-urlencoded (for handling HTML form data). The [FromBody] attribute tells the model binder to instead try and create the model from JSON content. — Brad
– Brad, Commented May 27, 2018 at 2:19

Brad · Accepted Answer · 2018-05-27 02:22:27Z

8

You have to use the [FromBody] attribute with a model parameter.

public class Credentials
{
    public string Email { get; set; }
    public string Password { get; set; }
}

public IActionResult Login([FromBody]Credentials creds)
{
    // do stuff
}

This is because in ASP.NET Core MVC the default content type is application/x-www-form-urlencoded (for handling HTML form data). The [FromBody] attribute tells the model binder to instead try and create the model from JSON content.

answered May 27, 2018 at 2:22

Brad

4,5632 gold badges19 silver badges24 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

krishna chaitanya Over a year ago

yep, got it. Thanks @Brad. then how can i send requests with just one parameter like just a string or int where i don't need to create models.

Chris Rosete · Accepted Answer · 2025-06-20 13:18:57Z

1

You must create an Class or Interface to send several parameters

public class PostParams
{
    public string email { get; set; }
    public string password { get; set; }
}     
[HttpPost]
public JsonResult loginInfo([FromBody] PostParams params)
{
  //do something here

}

edited Jun 20 at 13:18

Chris Rosete

1,26815 silver badges14 bronze badges

answered May 27, 2018 at 1:33

Abel Valdez

2,4081 gold badge19 silver badges34 bronze badges

3 Comments

krishna chaitanya Over a year ago

tried that, doesn't work. the model values still show as null.

Abel Valdez Over a year ago

please just take a look in the web tools if you are sending a OPTION request or a POST request, in angular normally the controller is calling twice take a look if you have this behavior.

krishna chaitanya Over a year ago

it is post request Request URL: localhost:52832/Account/loginInfo Request Method: POST Status Code: 200 OK Remote Address: [::1]:52832 Referrer Policy: no-referrer-when-downgrade

Collectives™ on Stack Overflow

MVC controller method not receiving json data from $http post

2 Answers 2

1 Comment

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

3 Comments

Your Answer

Sign up or log in

Post as a guest