FullCalendar:如何从db获取数据并在事件中显示(作为json feed)

时间:2016-05-19 10:13:51

标签: json ajax events continuous-integration fullcalendar

我是fullcalendar和ajax的新手。我很难从数据库中获取数据,这些数据应该显示在我的fullcalendar中。     我试过一个代码来做同样的事情。但我无法通过ajax作为json feed获取数据。     到目前为止,我通过codeigniter MVC从数据库获取数据。但是我     coulnt将数据传递给fullcalendar事件。

 The following is my view file: calendar.php


<script>
$(document).ready(function() {


$.ajax({
    url: "<?php echo base_url() ?>/common/calendar/show_holidays",
    type: 'POST', // Send post data
    data: 'type=fetch',
    async: true,
    success: function(s){
          freshevents = s;//alert(s);
    } 
});

$('#calendar').fullCalendar('addEventSource', JSON.parse(freshevents));

    /* initialize the calendar
    -----------------------------------------------------------------*/

    $('#calendar').fullCalendar({
        //events: JSON.parse(json_events),
        //events: [{"id":"14","title":"New Event","start":"2015-01-24T16:00:00+04:00","allDay":false}],
        utc: true,
        header: {
            left: 'prev,next today',
            center: 'title',
            right: 'month,agendaWeek,agendaDay'
        },
        editable: true,
        droppable: true, 
        events: {

        }

    });

   });
    </script>

1 个答案:

答案 0 :(得分:2)

首先,您需要将SQL结果集解析为JSON,您可以使用下一个PHP函数执行此操作:

连接数据库功能:

function connectDB(){
   $con = mysqli_connect("HOST", "USER", "PASS", "DB");
    if($con){
        echo 'OK';
    }else{
        echo 'KO';
    }   
    return $con;
}

断开与DB的连接的功能:

function disconnectDB($con){
    $close = mysqli_close($con);

    if($close){
        //echo 'OK';
    }else{
        //echo 'KO';
    }   
    return $close;
}

从一个结果集获取JSON解析的函数:

function getArraySQL(){
    $conexion = connectDB();
    //generate SQL query
    if(!$result = mysqli_query($conexion, "SELECT title,color,start FROM events")) die();

    $rawdata = array();

    while($row = mysqli_fetch_array($result))
    {
        $title=$row['title'];
        $color=$row['color'];
        $start=$row['start'];

        $rawdata[] = array('title'=> $title, 'color'=> $color, 'start'=> $start);
    }
    disconnectDB($conexion);
    //Parse to JSON and return
    $rawdata=json_encode($rawdata);
    return $rawdata;
}

完成此步骤后,您可以在JSON日历脚本中添加events

$(document).ready(function() {
    $('#calendar').fullCalendar({
        header: {
          left: 'prev,next today',
          center: 'title',
          right: 'month,agendaWeek'
        },
        events: <?php 
        $result = array();
        $result=getArraySQL();
        if(isset($result)){
            echo $result;
        }
        ?>,
        eventRender: function (event, element) {
        element.attr('href', 'javascript:void(0);');
        element.click(function() {
            alert(event.title);
        });
    }
    });

});

希望这可以帮到你。