I'm using Laravel 8 and creating a FullCalendar where when you click the event, more details can be seen via the modal that pops up.

events:[
    @foreach($events as $event)          
      { 
        id: '{{$loop->index}}', title: '{{$event->patientInfo->first_name}} - {{$event->patientTreatment->treatment}} - {{$event->patientService->service}}', 
        start: '{{$event->appointment}}', 
        resourceId: '{{$event->id}}', 
        color: '{{$event->branches->text_color}}', 
      },
    @endforeach
    ],

I'm retrieving the events Index from the id: '{{$loop->index}}'

eventClick: function(info) {
  var event_data = info.event.id;
},

I've checked it through alert(event_data); The alert verifies it's working thus far. Now I'm trying to get it so I can use it in PHP to get data and relational data beginning with this way

$event_data = $events[var_event_index_here];
$event_data->first_name; $event_data->phone;     
....etc

I have no idea how to use that javascript variable for the index. I've searched different ways of retrieving it, but this is what I've tried to test

eventClick: function(info) {

  var event_data = info.event.id;

  <?php
    $test= "<script>document.writeln(event_data);</script>";
  ?>

  var dialog =  '<div id="dialog" class="modalTitle"  style="z-index:9999">{{$test}}</div>';

  $('body').append(dialog);
  $('#dialog').dialog({modal:true, title: "TITLE"});
},

This is the result I'm getting