2

The situation: ajax call that calls an MVC action which returns List<CustomObject>.

During debugging, the MVC side shows that I have, for example, 20+ records with about 15 columns with data in an entity framework object format. That is to say that I can see the data in record.id and record.name like I should.

The data list is passed back to the ajax.success callback function but appears to only be a string describing object of type System.Collections.Generic.List'1[CustomObject]'. That is to say, it is just a string: System.Collections.Generic.List'1[CustomObject]'

How the devil do I get that data either

  1. readable by javascript

  2. into a javascript/jquery readable opbject.

Edit: code sample:

    public async Task<List<visitorInformation>> GetChartData(string startDate, string endDate) {
        //coalesce date into a single array
        DateTime[] dateRange = new DateTime[2];

        DateTime.TryParseExact(startDate, "yyyy-MM-dd", CultureInfo.InvariantCulture, DateTimeStyles.None, out dateRange[0]);
        DateTime.TryParseExact(endDate, "yyyy-MM-dd", CultureInfo.InvariantCulture, DateTimeStyles.None, out dateRange[1]);

        DateTime dtStartDate = dateRange[0];
        DateTime dtEndDate = dateRange[1];
        return await db.visitorInformation.Where(w => w.dateOfVisit >= dtStartDate && w.dateOfVisit <= dtEndDate).ToListAsync();
    }
user4593252
  • 3,496
  • 6
  • 29
  • 55
  • are you familiar with the `.ToList()` method.. can you show a bit more code for example how are you utilizing the EF Context Object..? – MethodMan Sep 26 '14 at 16:59
  • Code sample inserted. – user4593252 Sep 26 '14 at 17:03
  • How about the controller code? – Control Freak Sep 26 '14 at 17:03
  • You're trying to pass data to JavaScript? Sounds like [Web API](http://www.asp.net/web-api) is what you need to be using. It'll automatically convert the list to JSON (or XML, depending on content negotiation). You can retrieve that data with a simple AJAX call. – mason Sep 26 '14 at 17:06

1 Answers1

1

You aren't returning the list object as JSON data, which is the common way of passing it off to your ajax javascript.

To return JSON data, Your action would look something like this:

public JsonResult JSON(){

    string startDate = Request.Querystring["start"];
    string endDate = Request.Querystring["end"];

    return Json(GetChartData(startDate, endDate),JsonRequestBehavior.AllowGet);
}

This will return your object as JSON response so your ajax javascript can utilize it.

Then in your javascript you can return the object via ajax by using .get():

  var params = { start: "", end: "" };

  $.get("/controller/JSON", params, function(data){
      var itemsInList = data.length;
  });
Control Freak
  • 12,965
  • 30
  • 94
  • 145
  • One question: I've not seen this jquery use before so beg pardon if this is a bit daft: How to pass data to the json action? WOuld it be `$.get("/controller/JSON", data1, data2, function(data)... – user4593252 Sep 26 '14 at 17:19
  • 1
    Sure, checkout the revised code and see if it makes sense. – Control Freak Sep 26 '14 at 17:21
  • Thanks, looks like this might be the ticket but it's hanging at return await db.visitorInformation.Where(w => w.dateOfVisit >= dtStartDate && w.dateOfVisit <= dtEndDate).ToListAsync(); in the GetChartData function whereas calling it directly in an ajax it does not hang. Would that be an async issue or something else that I'm not seeing? – user4593252 Sep 26 '14 at 17:43
  • NM, it is indeed an async/await issue. For whatever reason, taking asyn and await out when called this way makes it work. I'm guessing the $/get and json are async by nature and that just kind of makes it puke. Well done on the answer man! – user4593252 Sep 26 '14 at 17:47
  • 1
    `.get()` is `async:true` by default, to disable this use `.ajax()` instead, the usage is very similar. http://api.jquery.com/jquery.ajax/ – Control Freak Sep 26 '14 at 17:59
  • 1
    You can also look here about it: http://stackoverflow.com/questions/13671798/is-get-of-jquery-asynchronous – Control Freak Sep 26 '14 at 18:04
  • Thanks for the explanations on that, ZeeTee. I hadn't heard of .get before but it looked a lot like it was just another form of .ajax. Just for you to have a happy day, I did what you suggested and it's returning the data in a usable data[i]["ColName"] format. Exactly what I wanted. You da man. – user4593252 Sep 26 '14 at 18:28