CODEWITHSUNDEEP
jquerycodeigniterfullcalendar
Bananenspin
Bananenspin

Reputation: 189

Fullcalendar not showing any event (backend Codeigniter)

This has me driving nuts since i cant seem to find anything thats wrong with my code or json. I already spent many hours trying to solve it and reading allot of answers on StackOverflow aswell.

I have the following pieces of code:

Jquery

$(document).ready(function() {
$('#calendar').fullCalendar({

        editable: true,

        events: "/action/json/calender",
        allDayDefault: false,
        eventDrop: function(event, delta) {
            alert(event.title + ' was moved ' + delta + ' days\n' +
                '(should probably update your database)');
        },

        loading: function(bool) {
            if (bool) $('#loading').show();
            else $('#loading').hide();
        }

    });
});

Controller

public function calender()
{
    $this->load->model('json_model');
    $data['json'] = $this->json_model->getCalender();
    $this->load->view('json/calender', $data);
}

Model

function getCalender()
{
    $sql = "SELECT id, title, start, end, user_id FROM gc_calender";
    $result = $this->db->query($sql);

    return $result;
}

View

<?php
$jsonevents = array();

foreach($json->result() as $entry)
{
$jsonevents[] = array(
    'id' => 1,
    'title' => $entry->title,
    'start' => $entry->start,
    'end' => $entry->end,
    'allDay' => ''
);

}

 echo json_encode($jsonevents);

JSON example

[{"id":1,"title":"title 1","start":"2013-09-08 00:00:00","end":"2013-09-08 10:00:00","allDay":""},{"id":1,"title":"title 2","start":"2013-09-17 00:00:00","end":"2013-09-17 10:00:00","allDay":""}]

What i've already tried:

Here's the fun part.. the demo that comes with the package works for me. However if i point my jquery code to that specific json url i still get no events. The calender itself gets rendered fine.

Something more that i tried: Using the demo HTML page with the JSON being served by codeigniter and it works.. Im starting to think there's either a conflict with a different script or maybe i need to load my scrips in the header instead of the footer?

Upvotes: 3

Views: 2279

Answers (3)

ario mardowo
ario mardowo

Reputation: 11

IT WORKS FOR ME, TRY IT!

Controller

public function show_calendar() 
{
    $query = $this->db->query("SELECT * FROM events ORDER BY start ASC");

    $jsonevents = array();

    foreach($query->result() as $entry)
    {
        $jsonevents[] = array(
            'id' => $entry->id,
            'title' => $entry->title,
            'start' => $entry->start,
            'end' => $entry->end,
            'url' => $entry->url,
            'allDay' => $entry->allDay
        );
    }

    $data['json'] = json_encode($jsonevents);

    $this->load->view('calendar',$data); 
}

View

<script type="text/javascript">

$(document).ready(function() {

    $('#calendar').fullCalendar({
        events:<?php echo $json ?>,

        header: 
        {
            left: 'prev,next today',
            center: 'title',
            right: 'month,agendaWeek'
        }          
    });

});
</script>

Upvotes: 1

Bananenspin
Bananenspin

Reputation: 189

Well i could have saved myself 2 days if i checked the header aswell... Our designer added the following to the css:

div {
position:relative;
overflow:hidden
}

After removing this, it just works fine. Cant believe it was this simple.

Upvotes: 2

Dave
Dave

Reputation: 1189

Try changing your event reference from "events" to "eventSources":

$('#calendar').fullCalendar({

  editable: true,
  eventSources: [ { url: '/action/json/calender' } ],
  allDayDefault: false,
  eventDrop: function(event, delta) {
      alert(event.title + ' was moved ' + delta + ' days\n' +
          '(should probably update your database)');
  },
  loading: function(bool) {
    if (bool) $('#loading').show();
      else $('#loading').hide();
  }

});

Upvotes: 0

Related Questions