JsonResult not returning data after Ajax call in .NET Core Razor Page

Question

I'm trying to return data from a JsonResult method within my ASP.Net Core (3.1) Razor Page Application back to a Razor Page, however, I'm having problems.

When I debug, I can see the OnGetCarList method within the Page Model being hit and no errors in the code when I step through, however, when the data is returned to the Ajax Success function and output with an alert, this is what I see:

Ajax Call (within Razor Page)

$.ajax({
          method: 'get',
          url: '/SPC/Index?handler=CarList',
          contentType: "application/json",
          dataType: "json",
          success: function (data) {
                alert(data);
                //addData(data)
                }
       })

Page Model

public JsonResult OnGetCarList()
{
    var converted = DateTime.Now.ToOADate();

    DateTime one = DateTime.Now;
    DateTime two = DateTime.Now.AddDays(1);
    DateTime three = DateTime.Now.AddDays(2);

    DateTime sTime = new DateTime(1970, 1, 1, 0, 0, 0, DateTimeKind.Utc);

    var c_one = (long)(one - sTime).TotalMilliseconds;
    var c_two = (long)(two - sTime).TotalMilliseconds;
    var c_three = (long)(three - sTime).TotalMilliseconds;

    dataPoints = new List<DataPoint>();

    dataPoints.Add(new DataPoint(c_one, 100));
    dataPoints.Add(new DataPoint(c_two, 200));
    dataPoints.Add(new DataPoint(c_three, 300));

    return new JsonResult(dataPoints);
}

//DataContract for Serializing Data - required to serve in JSON format
[DataContract]
public class DataPoint
{
    public DataPoint(double x, double y)
    {
        this.x = x;
        this.Y = y;
    }

    //Explicitly setting the name to be used while serializing to JSON.
    [DataMember(Name = "x")]
    public Nullable<double> x = null;

    //Explicitly setting the name to be used while serializing to JSON.
    [DataMember(Name = "y")]
    public Nullable<double> Y = null;
}

Any guidance is appreciated.

Thanks.

Update

I updated my Ajax call to what Serge said and now the Alert gives this.

$.ajax({
                method: 'get',
                url: '/SPC/Index?handler=CarList',
                contentType: "application/json",
                dataType: "json",
                success: function (data) {
                    alert(JSON.stringify(data));
                    //addData(data)
                }
       })

Serge · Accepted Answer · 2021-11-19 17:02:13Z

1

fix class , remove all attributes and add getters/ setters

public class DataPoint
{
    public DataPoint(double x, double y)
    {
       X = x;
       Y = y;
    }
  
 public double? X {get; set;}
 public double? Y {get; set;}

}

use JSON.stringify for test

        $.ajax({
        ....
        success: function (data) {
                alert(JSON.stringify( data));
        }, 
        .....

edited Nov 19, 2021 at 17:02

answered Nov 19, 2021 at 16:39

Serge

44.4k4 gold badges26 silver badges53 bronze badges

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

6 Comments

tcode Over a year ago

Thanks for your response. I've changed my Ajax call to your answer, and now the alert has changed, but still contains no data? Please see my updated question.

Serge Over a year ago

@tcode I updated my answer, try again

tcode Over a year ago

Brilliant- it’s working! Thank you!

Serge Over a year ago

@tcode you are welcome!

Serge Over a year ago

@MikeBrind It is written in my answer - for testing, to show data in alert window. You can' t show json object in alert without stringifying.

|

Mike Brind · Accepted Answer · 2021-11-20 07:42:42Z

1

You can treat the returned object as an instance of your server-side class:

success: function (dataPoint) {
    alert(`X: ${dataPoint.x}\nY: ${dataPoint.y}`);
}

answered Nov 20, 2021 at 7:42

Mike Brind

30.3k6 gold badges65 silver badges95 bronze badges

Collectives™ on Stack Overflow

JsonResult not returning data after Ajax call in .NET Core Razor Page

2 Answers 2

6 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

6 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related