get data from fullcalendar to php dynamic

[eluser]zykapratama[/eluser]
I want to ask, how to display data in fullcalendar plugin http://arshaw.com/fullcalendar/ in codeigniter view, so that when I click on the change month in fullcalendar data displayed below with the data on the calendar fullcalendar view, if there is no data in fullcalendar then, display the data in under fullcalendar will not appear too…

this is my view

Code:

$(document).ready(function() {
        var date = new Date();
        var d = date.getDate();
        var m = date.getMonth();
        var y = date.getFullYear();
        $('#calendar').fullCalendar({
            firstDay:'1',
            theme:true,
            eventColor: '#378006',
            header: {
                left: 'prev,next today',
                center: 'title',
                right: 'month'
            },
            // timeFormat: "dd-mm-yyyy H:i:s",
            editable: false,
            events: '<?= base_url(); ?>index.php/kalender/json_kategori/<?= $this->uri->segment(3); ?>',
            eventMouseover: function(calEvent, jsEvent, view) {
                savBg = $(this).css("background-color");
                savClr = $(this).css("color");
                $(this).css( { color:'#ffff00', backgroundColor:"#006" } );
                $("#test").css( { color:'#ffff00', backgroundColor:"#006" } );
                $(this).fadeTo('slow',.5);//.css(text-align,'right');
            },
            eventMouseout: function(calEvent, jsEvent, view) {
                $(this).css( { color:savClr, backgroundColor:savBg } );
                $("#test").css( { color:savClr, backgroundColor:savBg } );
                $(this).fadeTo('slow',1);
            },
            loading: function(bool) {
                if (bool) $('#loading').show();
                else $('#loading').hide();
            },
            eventClick: function(calEvent, jsEvent, view) {
                alert('Judul Even: ' + calEvent.title);
                // alert('Coordinates: ' + jsEvent.pageX + ',' + jsEvent.pageY);
                // alert('View: ' + view.name);
                // change the border color just for fun
                $(this).css('border-color', 'red');
            },
            dayClick: function(date, allDay, jsEvent, view) {
                if (allDay) {
                    alert(date);
                }else{
                    alert(date);
                }
                // alert('Coordinates: ' + jsEvent.pageX + ',' + jsEvent.pageY);
                // alert('Current view: ' + view.name);
                // change the day's background color just for fun
                $(this).css('background-color', 'red');
            }
        });
        // binding hover on day-number to change the cursor
        $('.fc-day-number').hover(function() {
            $(this).css('cursor', 'pointer');
        }, function() {
            $(this).css('cursor', 'auto');
        });

        // binding click on day-number
        $('.fc-day-number').click(function() {
            var d = $('#calendar').fullCalendar('getDate');
            d.setDate($(this).text());
            $('#calendar').fullCalendar('gotoDate', d);
            $('#calendar').fullCalendar('changeView', 'agendaDay');
        });
    });