Ajax success returns "undefined" in asp.net core

Question

I'm trying to get the json data by ajax and show them in the view. The data is correct in action method but when I want to show the data in table all the s are showed as undefined and so many rows that I know I don't have this much rows .maybe it is because of for loop and each loop but I really don't know how to fix it. This is the json data:

      {
   "$id": "1",
   "$values": [
  {
     "$id": "2",
      "TicketId": 32,
  "Author": "5aff2283-5e71-4b10-a809-7c0235ccc18d",
  "To": "f956d006-72b7-4a4c-b5cf-9354d6e6f193",
  "Status": 1,
  "priority": 2,
  "TrackingCode": "1bbdd10553634f2fbab1769cbf0b1b44",
  "CreateDate": "2021-04-04T10:10:35.5043873",
  "IsPrivate": true,
  "IsDeleted": false,
  "User": null,
  "ApplicationRole": {
    "$id": "3",
    "Title": "\u0628\u0631\u0646\u0627\u0645\u0647 \u0646\u0648\u06CC\u0633",
    "Description": null,
    "IsDelete": false,
    "CreateDate": "2021-03-17T12:20:46.6002855",
    "EditDate": null,
    "ParentId": null,
    "Roles": null,
    "Id": "f956d006-72b7-4a4c-b5cf-9354d6e6f193",
    "Name": "programmer",
    "NormalizedName": "PROGRAMMER",
    "ConcurrencyStamp": "a76600ef-8e82-4479-915d-41ad750cad5d"
  },
  "Answer": null
},
{
  "$id": "4",
  "TicketId": 33,
  "Author": "5aff2283-5e71-4b10-a809-7c0235ccc18d",
  "To": "f956d006-72b7-4a4c-b5cf-9354d6e6f193",
  "Status": 2,
  "priority": 0,
  "TrackingCode": "f316a0d4bf9c4014a8acce1c152a56de",
  "CreateDate": "2021-04-04T10:15:09.7256989",
  "IsPrivate": false,
  "IsDeleted": false,
  "User": null,
  "ApplicationRole": {
    "$ref": "3"
  },
  "Answer": {
    "$id": "5",
    "AnswerId": 6,
    "TicketId": 33,
    "UserId": "5aff2283-5e71-4b10-a809-7c0235ccc18d",
    "AnswerText": "\u003Cp\u003Ebbbbbb\u003C/p\u003E\r\n",
    "File": null,
    "DateTime": "2021-04-05T11:03:24.6079034",
    "IsDeleted": false,
    "Ticket": {
      "$ref": "4"
    },
    "User": null
  }
} 
]
}

This is the Ajax:

 <script type="text/javascript">

        $(document).ready(function () {
            loadData();
        });
    function loadData() {
        $.ajax({
            url: "/Ticket/GetMyTickets",
            type: "Get",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (ListData) {                    
                var str = "";
                for (var i = 0; i < ListData.length; i++) {
                    $.each(ListData[i], function (index, items) {                          
                        str += "<tr>";
                        str += "<td>" + ListData[i].Status + "</td>";
                        str += "<td>" + ListData[i].priority + "</td>";
                        str += "<td>" + ListData[i].TrackingCode + "</td>";
                        str += "<td>" + ListData[i].CreateDate + "</td>";
                        str += "<td>" + ListData[i].IsPrivate + "</td>";
                        str += "<td>" + ListData[i].To + "</td>";
                        str += "<td><a onclick=Edit(this) data-toggle='modal' data- 
          target='#myModal'>نمایش پاسخ ها</a></td>";

                        str += "</tr>";
                    },
                BodyData.innerHTML = str);
                    $(".TblData tr").fadeIn(1000);

                };

                    }
        });
    }

I searched a lot but I didn't find any solution for the problem.

UPDATE This is the output of console.log(ListData):

  {
 "$id": "1",
 "$values": [
      {
      "$id": "2",
     "TicketId": 33,
     "Author": "5aff2283-5e71-4b10-a809-7c0235ccc18d",
     "To": "f956d006-72b7-4a4c-b5cf-9354d6e6f193",
     "Status": 2,
       "priority": 0,
      "TrackingCode": "f316a0d4bf9c4014a8acce1c152a56de",
      "CreateDate": "2021-04-04T10:15:09.7256989",
       "IsPrivate": false,
         "IsDeleted": false,
       "User": {
       "$id": "3",
        "FullName": "\u0645\u062F\u06CC\u0631 \u0633\u0627\u06CC\u062A",
      "Avatar": "DefualtAvatar.jpg",
        "IsDelete": false,
      "CreateDate": "2021-03-16T13:05:20.6549686",
        "EditDate": null,
         "Id": "5aff2283-5e71-4b10-a809-7c0235ccc18d",
       "UserName": "09876543210",
         "NormalizedUserName": "09876543210",
        "Email": "[email protected]",
          "NormalizedEmail": null,
          "EmailConfirmed": false,
          "PasswordHash": 
      "AQAAAAEAACcQAAAAEFbvXk/J1tXDz/
        gAkIwWVjGWwSCeVhRgpPM0PVaRt1NJ1xlNr8HhxtMNWgd2u40BQw==",
     "SecurityStamp": "IELKDSXBF5RE3MFHN7CNVOIGWWMK4QAV",
       "ConcurrencyStamp": "517cf6f0-2f41-44a6-9a99-9512e0ffc471",
    "PhoneNumber": "09876543210",
    "PhoneNumberConfirmed": false,
    "TwoFactorEnabled": false,
    "LockoutEnd": null,
    "LockoutEnabled": true,
    "AccessFailedCount": 0
  },
  "ApplicationRole": {
    "$id": "4",
    "Title": "\u0628\u0631\u0646\u0627\u0645\u0647 \u0646\u0648\u06CC\u0633",
    "Description": null,
    "IsDelete": false,
    "CreateDate": "2021-03-17T12:20:46.6002855",
    "EditDate": null,
    "ParentId": null,
    "Roles": null,
    "Id": "f956d006-72b7-4a4c-b5cf-9354d6e6f193",
    "Name": "programmer",
    "NormalizedName": "PROGRAMMER",
    "ConcurrencyStamp": "a76600ef-8e82-4479-915d-41ad750cad5d"
  },
  "Answer": {
    "$id": "5",
    "AnswerId": 6,
    "TicketId": 33,
    "UserId": "5aff2283-5e71-4b10-a809-7c0235ccc18d",
    "AnswerText": "\u003Cp\u003Ebbbbbb\u003C/p\u003E\r\n",
    "File": null,
    "DateTime": "2021-04-05T11:03:24.6079034",
    "IsDeleted": false,
    "Ticket": {
      "$ref": "2"
    },
    "User": {
      "$ref": "3"
    }
  }
 }
  ]
  }

Answer 1

According to your json structure you only need one loop to iterate through your json array . So, simply use ListData["$values"] inside $.each and then get respective value using keyname.

Demo Code :

//just for demo
var ListData = {
  "$id": "1",
  "$values": [{
      "$id": "2",
      "TicketId": 32,
      "Author": "5aff2283-5e71-4b10-a809-7c0235ccc18d",
      "To": "f956d006-72b7-4a4c-b5cf-9354d6e6f193",
      "Status": 1,
      "priority": 2,
      "TrackingCode": "1bbdd10553634f2fbab1769cbf0b1b44",
      "CreateDate": "2021-04-04T10:10:35.5043873",
      "IsPrivate": true,
      "IsDeleted": false,
      "User": null,
      "ApplicationRole": {
        "$id": "3",
        "Title": "\u0628\u0631\u0646\u0627\u0645\u0647 \u0646\u0648\u06CC\u0633",
        "Description": null,
        "IsDelete": false,
        "CreateDate": "2021-03-17T12:20:46.6002855",
        "EditDate": null,
        "ParentId": null,
        "Roles": null,
        "Id": "f956d006-72b7-4a4c-b5cf-9354d6e6f193",
        "Name": "programmer",
        "NormalizedName": "PROGRAMMER",
        "ConcurrencyStamp": "a76600ef-8e82-4479-915d-41ad750cad5d"
      },
      "Answer": null
    },
    {
      "$id": "4",
      "TicketId": 33,
      "Author": "5aff2283-5e71-4b10-a809-7c0235ccc18d",
      "To": "f956d006-72b7-4a4c-b5cf-9354d6e6f193",
      "Status": 2,
      "priority": 0,
      "TrackingCode": "f316a0d4bf9c4014a8acce1c152a56de",
      "CreateDate": "2021-04-04T10:15:09.7256989",
      "IsPrivate": false,
      "IsDeleted": false,
      "User": null,
      "ApplicationRole": {
        "$ref": "3"
      },
      "Answer": {
        "$id": "5",
        "AnswerId": 6,
        "TicketId": 33,
        "UserId": "5aff2283-5e71-4b10-a809-7c0235ccc18d",
        "AnswerText": "\u003Cp\u003Ebbbbbb\u003C/p\u003E\r\n",
        "File": null,
        "DateTime": "2021-04-05T11:03:24.6079034",
        "IsDeleted": false,
        "Ticket": {
          "$ref": "4"
        },
        "User": null
      }
    }
  ]
}

$(document).ready(function() {
  loadData();
});

function loadData() {
  /* $.ajax({
     url: "/Ticket/GetMyTickets",
     type: "Get",
     contentType: "application/json; charset=utf-8",
     dataType: "json",
     success: function(ListData) {*/
  var str = "";
  //get values array
  $.each(ListData["$values"], function(index, items) {
    //use items.nameofkey
    str += "<tr>";
    str += "<td>" + items.Status + "</td>";
    str += "<td>" + items.priority + "</td>";
    str += "<td>" + items.TrackingCode + "</td>";
    str += "<td>" + items.CreateDate + "</td>";
    str += "<td>" + items.IsPrivate + "</td>";
    str += "<td>" + items.To + "</td>";
    str += "<td><a href='#' onclick='Edit(this)' data-toggle='modal' data-target='#myModal'> نمایش پاسخ ها </a></td> ";
    str += "</tr>";
  });
  $(".TblData").html(str)
  $(".TblData").fadeIn(1000);
  /* };

    }
  });*/
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table border="1">
  <tbody class="TblData"></tbody>
</table>