Laravel Ajax返回未定义的关系一对多

Question

I have a problem to use ajax on Laravel to each data on relationship one to many. I'm trying to use ajax but return undefined.

This is Code if using Laravel foreach

<div id="project-data">
  @foreach ($projectstatus as $project)
        <li>{{$project->status}}</li>

        @foreach($projectstatus->project as $projectlist)
            <li>{{$projectlist->project_name}}</li>
        @endforeach

  @endforeach
</div>

I'm trying using jquery for each This is My Code

function getDataProyek(){
  $.ajax({
          url: "{{ url('dt.proyek') }}",
          type: "GET",
          dataType: "JSON",
          success : function(data) {
            jQuery.each(data, function(index,project) {
              $('#proyek-data').append('<li>'+project.status+'</li>'+
                   <li>'+project.project.project_name+'</li>');
            });

          }
       });
    }

This is My Controller

 public function dtproyek()
{
    $projectstatus= Status::with('project')->orderBy('created_at','ASC')->get();
    return $projectstatus;
}

This is json return

 [
    {
    id: "1",
    status: "Waiting",
    created_at: "2018-07-30 12:24:25",
    updated_at: "2018-07-30 12:24:25",
    project: [
    {
         id: "2",
         project_name: "Project 1",
         created_at: "2018-08-11 11:59:51",
         updated_at: "2018-09-24 07:49:38",
    }
    ]
    }
  ]

Answer 1

In JSON result project is an array and you must use index for that on getDataProyek function or use a loop for that

$('#proyek-data').append('<li>'+project.status+'</li>'+
               '<li>'+project.project[0].project_name+'</li>');

and in your controller return json data

return response()->json($projectstatus);

Update:

$.each(data, function(index,project) {
    var str='<li>'+project.status+'</li>';

    $.each(project.project, function(key,val) {
         str+='<li>'+val.project_name+'</li>';
    });
    $('#proyek-data').append(str);
});