Parse JSON List (via C#) in jQuery AJAX Success Callback

Question

I'm using jQuery's AJAX methods to call a C# service to return a JSON serialized list.

[HttpPost]
public JsonResult SearchTicket(ViewModelTicket ticket) {

    var list = UnitOfTicket.Where(x =>x.TicketId == ticket.TicketId);

    return Json(new { list  }, JsonRequestBehavior.AllowGet);
}

I parse the response from within the success callback function and render it as HTML.

 $.ajax({
        type: "POST",
        url: url,
        data: JSON.stringify(Ticket),
        dataType: "json",
        contentType: 'application/json; charset=utf-8',
        success: function (list) {
            var data = list;
            for (var i in data) {
                alert(JSON.stringify(data[i]));
                $('#tbody-element').append(
                     '<tr>' +
                         '<td>' + data[i].TicketId + '</td>' +
                         '<td>' + data[i].Title + '</td>' +
                         '<td>' + data[i].PriorityId + '</tr>' +
                         '<td>' + data[i].OpenDateAndTime + '</tr>' +
                         '<td>' + data[i].SlaExpiration + '</td>' +
                     '</tr>'
                 );
             }
         },
         error: function () {
             alert("Error occured!!")
         }
     });

The response is displayed in an alert:

[{"TicketId":1,"OpenDateAndTime":"/Date(1517833557277)/","ClosedDateTime":null,"VersionId":140,"PriorityId":2,"CompanyId":0,"UserId":null,"Rate":null,"SlaExpiration":null,"TicketTypeId":1,"StatusId":1,"ProductId":1,"SubProductId":1,"TaskId":1,"Title":"Primeiro Chamado","Files":null}]

My problem is rendering an object with an undefinded value. For example: data[i].Title ...

I am following this post: Parse returned C# list in AJAX success function

And you only want 5 properties of your objects so you should only be return those 5 properties, not all properties — user3559349
– user3559349, Commented Feb 5, 2018 at 20:38

Daniel Thompson · Accepted Answer · 2018-02-05 20:55:20Z

0

If you try alert(JSON.stringify(data)) what do you see? Your code works as if data is an Array of objects, but it may actually be an Array full of nested Arrays.

If alert(JSON.stringify(data[i])); is showing you [{"TicketId":...}] it looks like data[i] is an Array containing a single object--in this case, data[i].TicketId is undefined but data[i][0].TicketId should have the value you want. If this is the case, using data[i][0] instead of data[i] across the board should help you out.

Note: I'd be careful about using for (var i in data), though, since if data is an Array and you have any sort of data added to Array.prototype (e.g. a polyfilled Array method), then it will be included in this loop. It'd be safer to use:

for (var i in data) {
    if (data.hasOwnProperty(i)) {
        ...
    }
}

answered Feb 5, 2018 at 20:55

Daniel Thompson

5362 silver badges9 bronze badges

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

1 Comment

user3559349 Over a year ago

And the reason that happens is because OP is using return Json(new { list }, JsonRequestBehavior.AllowGet); when the correct code is just return Json(list, JsonRequestBehavior.AllowGet);

Anis Alibegić · Accepted Answer · 2018-02-05 20:57:13Z

$.ajax({
    type: "POST",
    url: url,
    data: JSON.stringify(Ticket),
    dataType: "json",
    contentType: 'application/json; charset=utf-8',
    success: function (list) {
        for(var i = 0, len = list.length; i < len; i++) {
            $('#tbody-element').append(
                 '<tr>' +
                     '<td>' + list[i].TicketId + '</td>' +
                     '<td>' + list[i].Title + '</td>' +
                     '<td>' + list[i].PriorityId + '</tr>' +
                     '<td>' + list[i].OpenDateAndTime + '</tr>' +
                     '<td>' + list[i].SlaExpiration + '</td>' +
                 '</tr>'
             );
        }
    },
    error: function () {
        alert("Error occured!!")
    }
});

Your response is already parsed which means your list variable is an array.

Collectives™ on Stack Overflow

Parse JSON List (via C#) in jQuery AJAX Success Callback

2 Answers 2

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related