Question

我正在尝试开发一个我需要使用此日历的应用程序：http://fullcalendar.io/

问题是我可以手动填充它，但我无法从我的数据库中填充它。

这是填充日历的功能：

$('#calendar').fullCalendar({
       header: {
            left: 'prev,next today',
            center: 'title',
            right: 'month,agendaWeek,agendaDay'
        },
        editable: true,
        eventLimit: true, 
        events:[
            {
                title: "aaaa",
                start: "2014-12-12"
            },
            {
                title: "bbb",
                start: "2014-12-13"
            }
        ]


    });



});

这是允许我从数据库中获取数据的函数：

function getEvents(db){

        db.transaction(function (tx) {
        tx.executeSql('SELECT * FROM NOTES', [], function (tx, results) {
           // var allEvents = [];
           var allEvents=[]; 

            for (var i = 0; i < results.rows.length; i++){
            //var event = {};
            allEvents.push({
                title: results.rows.item(i).note,
                start: results.rows.item(i).whenn

            });


            }


            $.each(allEvents, function(idx, obj){
                alert(obj.title);
                });
        }, null);

        });



    };

当我在事件中调用函数getEvents（db）时，它会显示警报，但不会填充日历。

PS：我不能使用php文件。

Answer 1

您可以使用renderEvent

.fullCalendar( 'renderEvent', event [, stick ] )

，顾名思义，它会在日历上呈现一个新事件。

根据the docs，事件必须是具有标题的事件对象，并且至少从头开始。通常，一旦日历重新获取其事件源，事件将消失（例如：单击prev / next时）。但是，将stick指定为true将导致事件永久固定到日历。

对你而言，我想这会转化为：

$.each(allEvents, function(idx, obj){
  $('#calendar').fullCalendar( 'renderEvent', obj);
});

我还没有使用过fullCalendar，但是如果这不起作用，那就做一个你已经得到的东西，我会让你成为一个有效的榜样。

如何使用javascript填充日历？

1 个答案: