0

I am using Fullcalendar, get call event id on event mouse hover, this event id passes in ajax call for getting the record from the database based on event id. Issue is that how to pass variable out of ajax success function. I am doing like this way

eventMouseover: function(calEvent) {
       var start;
       var end;
                    $.ajax({
                        url: js_base_path+ 'calendar/get_date_time/'+calEvent.id,
                        type:"GET",
                        dataType:"json",
                        success:function(data){
                            start = data.start_datetime;
                            end = data.end_datetime;
                        },
                        
                    });

                var realstart;
                if(start == '00.00')
                {
                    realstart = calEvent.title;
                }
                else
                {
                    realstart = start+ ' - ' + end + ': ' +calEvent.title;
                }
                $(this).popover({
                    title: realstart,
                    content: calEvent.description,
                    trigger: 'hover',
                    template: popfunction(calEvent.borderColor),
                    placement: "top",
                    atMouse: true,
                    container: 'body'
                }).popover('show');
            },

I am facing this error when event mouse hover

Uncaught ReferenceError: start is not defined

This is my controller function

public function get_date_time($id)
{
    
    $results = $this->calendar->get_calendar_row($id);
    $data['start_datetime'] = date("H:i", strtotime($results->from_date_time));
    $data['end_datetime'] = date("H:i",  strtotime($results->to_date_time));


    echo json_encode($data);
}
Alex Robbio
  • 21
  • 4
  • `var` is a `function-defined` variable, meaning that its scope will exist in the whole function it was created in, in this you have two separate functions trying to use the same `var` variable `start` and `end` for that matter. Try creating a local variable `start` and setting it equal to the one you currently have. – Gunnarhawk Mar 05 '21 at 16:10
  • Is your AJAX request succeeding? Check the network tab on your browser and see if the request went through correctly. – Gunnarhawk Mar 05 '21 at 16:28
  • Are `data.start_datetime` and `data.end_datetime` defined? – Gunnarhawk Mar 05 '21 at 16:50
  • Before we move on, set `$data['start_datetime']` and `$data['end_datetime']` to some test data in string format and see if the request goes through fine. Because then your problem may be in `strtotime($results->from_date_time));` – Gunnarhawk Mar 05 '21 at 16:56
  • Just move all the `var realstart;...` bit onwards inside the "success" callback of the Ajax function. Then it won't be executed until the Ajax has finished, and therefore the variables you need will have been populated. – ADyson Mar 05 '21 at 20:15
  • See also: [How do I return the response from an asynchronous call?](https://stackoverflow.com/questions/14220321/how-do-i-return-the-response-from-an-asynchronous-call) – ADyson Mar 05 '21 at 20:16
  • Alternatively, scrap the Ajax call entirely, and just put these values as additional properties of your event when it's first downloaded to the calendar. Then you can read them immediately without needing another request to the server just for two small variables. – ADyson Mar 05 '21 at 20:17

0 Answers0