Illuminati
Illuminati

Reputation: 548

FullCalendar JSON Feed not working: my calendar doesn't put the data from the JSON feed onto my webpage

Why doesn't my calendar put the data from the JSON feed onto my webpage?

<script type='text/javascript'>
$(document).ready(function() {
    var date = new Date();
    var d = date.getDate();
    var m = date.getMonth();
    var y = date.getFullYear();
    var calendar = $('#calendar').fullCalendar({
        events: 'myfeed.php',
    header: {
            left: 'prev,next today',
            center: 'title',
            right: 'month,agendaWeek,agendaDay'
        },
        selectable: true,
        selectHelper: true,
    eventSources: [

    // your event source
    {
        url: '/myfeed.php', // use the `url` property
        color: 'red',    // an option!
        textColor: 'black'  // an option!
    }
    // any other sources...
],
  eventClick: function(calEvent, jsEvent, view) {
if (!confirm("Are you sure you want to delete this?")) {
    }
else
{
    // remove calender, and post the info to page 
$.post("mybook.php", { idnumber: calEvent.id, remove: '1' } );
$('#calendar').fullCalendar('removeEvents', [calEvent.id]);
}
}
    });     
});
</script>

JSON Feed PHP Code

<?php    $arr = array('id' => '1', 'title' => 'Apples', 'start' => '1372530615', 'end' => '1372537615', 'allDay' => false);
echo json_encode($arr);
?>

Charles web debugger shows that the script is assessing the right page, and it has a response. But, my calendar does nothing. :( I thought it might be because I was using SSL, but I have tried both ways.

Reduced my code to

<script type='text/javascript' src='jquery-1.9.1.min.js'></script>
<script type='text/javascript' src='fullcalendar.js'></script>
<script type='text/javascript'>
$(document).ready(function() {
var calendar = $('#calendar').fullCalendar({
    events: 'myfeed.php'
});     
});
</script>

JSON Feed Output

{"id":"1","title":"Apples","allDay":false,"start":"1372507615","end":"1372537615"}

Upvotes: 2

Views: 2408

Answers (4)

Vishal Kumar
Vishal Kumar

Reputation: 1

I landed on this question with the same issue and did the following things to get it to work:

  1. Make sure that there are square brackets [] at the end
  2. Make sure that there are no extra commas at the end (this is what got me) - apparently it is ok with it when using a the paramenters inline, but when loading from JSON it has this issue
  3. Use double quotes for both fiend and values.
  4. I ended up rewriting my php to create an object array, load the values into the array, and then convert it into JSON (this took care of all the above JSON formatting issues)

My JSON output looked like:

[{"title":"Vishal","start":"2018-01-12 00:00:00","end":"2018-01-12 10:00:00"},{"title":"Vishal","start":"2018-01-14 14:00:00","end":"2018-01-14 15:00:00"}]

My PHP code looks like:

$data = array();

foreach($results as $run)
{

    $obj = (object) [
    'title' => $run->firstname,
    'start' => $run->startdatetime,
    'end' => $run->enddatetime
    ];

    $data[] = $obj;

}
echo json_encode($data);

I hope this helps.

Upvotes: 0

ColdSharper
ColdSharper

Reputation: 84

I want to confirm the accepted answer above. I have seen several such questions about events not showing up in FullCalendar, particularly JSON, and the solutions seem to be about syntax. You have to give FullCalendar EXACTLY what it wants to see, and documentation on that point is somewhat unclear. Expect a lot of trial and error.

Upvotes: 0

Illuminati
Illuminati

Reputation: 548

Had to put [ ] around my JSON Output.

Upvotes: 0

slash197
slash197

Reputation: 9034

Remove eventSources if you are already using events property.

Upvotes: 1

Related Questions