如何使用ajax将数据放入fullcalendar中

时间:2016-01-26 01:05:10

标签: jquery ajax fullcalendar

我使用fullcalendar插件时遇到问题。我无法使用ajax从我的数据库中提取数据。

这是我的功能。

function fullCalendar() {
        $.ajax({
          type: 'get',
          url: "../admin/phpfunction.php?getCalendar",
          dataType: 'json',
          success: function(data){
              var datas = [];
              var source = { events: [

                $.each(data, function(index, item){
                    {
                        title: item.titles,
                        url: item.urls,
                        start: item.starts,
                        end: item.ends
                    }
                });

            ]};

            $('#calendar').fullCalendar( source );

          }
        });
    }

我仍然是ajax的新手。

2 个答案:

答案 0 :(得分:0)

我想分享我的所作所为,如果可以,我会很高兴

  

首先,你应该为fullcalendar初始化创建一个对象函数。所以你可以在你的ajax工作时随时调用。

 var Calendar = {
   //this is your html calendar div
   init : function (data){
       $('#calendar').fullCalendar({  
        theme: true,
       // header: {
       //     left: 'prev,next today',
       //     center: 'title',
       //     right: 'month'
       // },
        buttonText: {
            today: 'today',
            week: 'week',
            day: 'day'
        },
        events: typeof data === 'undefined' ? '' : data  //check data is exists
      });
     },
    //ajax data
    fullCalendar : function (){
         $.ajax({
      type: 'get',
      url: "../admin/phpfunction.php?getCalendar",
      dataType: 'json',
      success: function(data){            
     //you should make your data is like this object format return from db
     //    data = [{
     //               title: "a",
     //               url  : "www.sdf",
    //               start: "2016-01-12 00:00:00",
    //               end  : "2016-01-15 00:00:00"
    //           },
    //           {
    //                title: "b",
    //                url  : "www.sdf",
    //                start: "2016-01-12 00:00:00",
    //                end  : "2016-01-15 00:00:00"
    //            },
    //            {
    //            ...
    //            }];               
    //if ok with that above format just call init() 
          Calendar.init(data);
            }
          });
      }
    };
//this document ready function
$(document).ready(function(){
 Calendar.init();//initialize calendar
 Calendar.fullCalendar();//your ajax function
 });

答案 1 :(得分:0)

希望它会对你有所帮助。干杯!!快乐编码

var _calenderEvents = [];

  $.each(data, function(index, item){
   _calenderEvents.push({
       title: item.titles,
       url: item.urls,
       start: item.starts,
       end: item.ends
   });
  });

   $('#calendar').fullCalendar({
                header: {
                    left: 'month,agendaWeek,agendaDay',
                    center: 'title',
                    right: 'prev,next today'
                },
                views: {
                    week: {                      
                        scrollTime: '00:00',   
                        allDaySlot: false,
                        },
                    day: {
                        scrollTime: '00:00:00',  
                        allDaySlot: false,
                    }
                },
                defaultDate: getCurrentDate(),             
                editable: false,
                slotDuration: '00:15:00',              
                eventDurationEditable: true,
                events: _calenderEvents,               
                slotEventOverlap: false,
  });