如何使用我的数据库值填充完整日历



我正在构建一个应用程序,其中我正在使用著名的fullCalendar。现在,我需要使用数据库中存在的值填充日历。我正在尝试使用 AJAX 调用来做到这一点。但它不起作用.任何帮助将不胜感激。

这是我的 jsp .我用来显示我的日历的那个。

    <!DOCTYPE html>
<html>
<head>
<link href='css/fullcalendar.css' rel='stylesheet' />
<link href='css/fullcalendar.print.css' rel='stylesheet' media='print' />
<script src='js/jquery.min.js'></script>
<script src='js/jquery-ui.custom.min.js'></script>
<script src='js/fullcalendar.min.js'></script>
<link href="jquery-ui-1.10.0.custom.css" rel="stylesheet" type="text/css" media = "all"/>
<link rel='stylesheet' type='text/css' href='cssdata/fullcalendar.css' />
<script src="js/jquery-1.9.0.js"></script>
<script src="js/jquery-ui-1.10.0.custom.min.js"></script>
<script type='text/javascript' src='js/fullcalendar.js'></script>
<pre>
<script>
$(document).ready(function() {
    getEvents();
        var date = new Date();
        var d = date.getDate();
        var m = date.getMonth();
        var y = date.getFullYear();
        $('#calendar').fullCalendar({
            header: {
                left: 'prev,next today',
                center: 'title',
                right: 'month,basicWeek,basicDay'
            },
            editable: true,
            events: [ getEvents()
                        /* {
                    title: 'All Day Event',
                    start: new Date(y, m, 1)
                }, */
            ] 
        });
    });
    function getEvents(){
        alert("hi");
        $.post("http://localhost:8080/S360Portal/eventAjax.action", {},
          function(data){
            alert("Hello");
            alert(data);
          });
    }
</script>
<style>
    body {
        margin-top: 40px;
        text-align: center;
        font-size: 14px;
        font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;
        }
    #calendar {
        width: 900px;
        margin: 0 auto;
        }
</style>
</head>
<body>
<div id='calendar'></div>
</body>
</html>

尝试使用 eventSources 而不是 events,考虑到您的函数实际上返回任何事件。为什么不使用$.Ajax({})而不是$.post?它会让你的生活更轻松。

这是我如何做到这一点的示例:

事件源数组。

var sources = {
    sourceone: {
        url: ajaxcallURL(),
        type: 'POST',
        data: { 'year': y },
        cache: false,       //this is optional
        color: '#6C92A8',   //this is optional
        textColor: 'white'  //this is optional
    }
}

全日历通话中,我有这个:

var calendar = $('#calendar').fullCalendar({
...
eventSources: [sources.sourceone],
...
});

这对我有用,请注意,我正在返回 JSON,因此,例如,如果您要返回 XML,则必须迭代 XML。

此外,如果您的事件返回的日期与接受的日期不同,它们将不会在日历中映射,( yyyy-mm-dd ) 有效。

祝你好运

相关内容

  • 没有找到相关文章