$http GET Receiving Empty Body

Question

I have a GET method in angularjs that receives data from an API controller in C#. The controller is returning the data and the $http get method is receiving a response, but the response content body is empty.

My HttpGet API controller function:

[HttpGet]
[Route("api/LandingPage/GetByDate")]
public HttpResponseMessage GetByDate(DateTime startDate, DateTime endDate)
{
    try
    {
        var startDateParam = new SqlParameter("@startDate", startDate);
        var endDateParam = new SqlParameter("@endDate", endDate);

        var confirmData = m_databaseObject.Database.SqlQuery<PageModel>("[dbo].[GetPageData] @startDate,@endDate", startDateParam, endDateParam).ToList();

        return Request.CreateResponse(HttpStatusCode.OK, confirmData);
    }
    catch (Exception e)
    {
        return Request.CreateErrorResponse(HttpStatusCode.NotFound, $"Error occured {e.Message} {startDate:yyyy-MM-dd} {endDate:yyyy-MM-dd}");
    }
}

The object I want to return:

public class PageModel
{
    string Name { get; set; }
    int? FirstTotal { get; set; }
    int? FisrtInitial { get; set; }
    int? FisrtApproval { get; set; }
    int? SecondTotal { get; set; }
    int? SecondInitial { get; set; }
    int? SecondApproval { get; set; }
    int? Validated { get; set; }
    int? NotSettled { get; set; }
}

The GET method:

this.getLandingPage = function ($scope) {
    $scope.error = "";
    $scope.message = "";
    return $http({
        method: "GET",
        url: apiName + "LandingPage/GetByDate?startDate=" + $scope.StartDate + "&endDate=" + $scope.EndDate,
        headers: { 'Content-Type': 'application/json' }
    }).success(function (data) {
        if (data.length === 0)
            $scope.message = "No Data found";
        else {
            $scope.LandingPageData = data;
        }
    }).error(function (error) {
        $scope.LandingPageData = null;
        if (error)
            $scope.error = error.Message;
        else
            $scope.error = "Data services may not be running, Please check!";
    })
}

My confirmData variable in my controller contains data when the function returns. My angularjs GET method returns success with data.length equal to 1, but there are no values contained in data.

Can anyone shed some light on why my data is not being transferred properly?

`data` contains an object array of size 1 with an empty object — Kevin K., Feb 09 '17 at 22:19
Have you debugged your controller and ensured confirmData actually has a value? — Shane Ray, Feb 09 '17 at 22:37
Yeah. The `PageModel` object contains data when the controller returns — Kevin K., Feb 09 '17 at 23:14

score 1 · Accepted Answer · answered Feb 10 '17 at 15:53

It turned out that my PageModel class variables needed to be declared as public in order to pass the data from the controller.

Changing the PageModel class to this worked:

public class PageModel
{
    public string Name { get; set; }
    public int? FirstTotal { get; set; }
    public int? FisrtInitial { get; set; }
    public int? FisrtApproval { get; set; }
    public int? SecondTotal { get; set; }
    public int? SecondInitial { get; set; }
    public int? SecondApproval { get; set; }
    public int? Validated { get; set; }
    public int? NotSettled { get; set; }
}

kat1330 · Answer 2 · 2017-02-09T22:39:11.893

Try to return JSON instead HttpResponseMessage:

[HttpGet]
[Route("api/LandingPage/GetByDate")]
public JsonResult GetByDate(DateTime startDate, DateTime endDate)
{
    try
    {
        var startDateParam = new SqlParameter("@startDate", startDate);
        var endDateParam = new SqlParameter("@endDate", endDate);

        var confirmData = m_databaseObject.Database.SqlQuery<PageModel>("[dbo].[GetPageData] @startDate,@endDate", startDateParam, endDateParam).ToList();

        return new JsonResult() { Data = confirmData , JsonRequestBehavior = JsonRequestBehavior.AllowGet };
    }
    catch (Exception e)
    {
        throw;
    }
}

On client side your data should be placed in response data property. In your case it should be:

data.data

But please try to use then function inteadsuccess function:

.then(function (data) {
        var result = data.data;
    });

Even you can avoid JsonResult and use string. Serialize your model into JSON string and return string.

I tried using JsonResult and I am having the same problem. – Kevin K. Feb 09 '17 at 22:35 — Kevin K., Feb 09 '17 at 22:35
@KevinK. Try to use `then` instead `sucess`. – kat1330 Feb 09 '17 at 22:39 — kat1330, Feb 09 '17 at 22:39

score 0 · Answer 3 · answered Feb 09 '17 at 22:19

0

Generally the data is nested under the data property.

.success(function (resp) {
    if (resp.data.length === 0)
        $scope.message = "No Data found";
    else {
        $scope.LandingPageData = resp.data;
    }
})

answered Feb 09 '17 at 22:19

Shane Ray

1,449
1
13
18

When I try this I get `resp.data` as undefined. – Kevin K. Feb 09 '17 at 22:28
What do you see as the response in the network console? – Shane Ray Feb 09 '17 at 22:30
The response code is 200 and the response body is `[{}]` – Kevin K. Feb 09 '17 at 22:35
Have you debugged your controller and ensured confirmData actually has a value? You may try to just return an explicitly defined array and see if that works. – Shane Ray Feb 09 '17 at 22:43

score 0 · Answer 4 · edited May 23 '17 at 11:45

Which version of angular are you using? From 1.6 .success is deprecated:

And, any specific reason why you are setting the Content-type header? You may use a simpler way:

return $http.get(url: apiName + "LandingPage/GetByDate?startDate=" + $scope.StartDate + "&endDate=" + $scope.EndDate, ).then(successCallback, errorCallback);

And then define your callback functions separately.

$http GET Receiving Empty Body

4 Answers4