Question

我正在尝试制作一个fullcalendar版本，该版本将从数据库加载并允许重复发生的事件。这是我的代码。

<script>
$(document).ready(function() {
$.ajax({
    url: 'process.php',
    type: 'POST',
    data: 'type=fetch',
    async: false,
    success: function(s){
        json_events = s;
    }
});
$('#calendar').fullCalendar({
    events: JSON.parse(json_events),
    header: {
        left: 'prev,next today',
        center: 'title',
        right: 'month,agendaWeek,agendaDay'
    },
    defaultView: 'month',
    editable: true, 
    slotDuration: '00:30:00',
    eventRender: function(event){
        return (event.ranges.filter(function(range){ 
            return (event.start.isBefore(range.dowend) && event.end.isAfter(range.dowstart));
        }).length) > 0;
    }, 
    eventReceive: function(event){
        var title = event.title;
        var start = event.start.format("YYYY-MM-DD[T]HH:mm:SS");
        $.ajax({
            url: 'process.php',
            data: 'type=new&title='+title+'&startdate='+start+'&zone='+zone,
            type: 'POST',
            dataType: 'json',
            success: function(response){
                event.id = response.eventid;
                $('#calendar').fullCalendar('updateEvent',event);
            },
            error: function(e){
                console.log(e.responseText);
            }
        });      
    }
});
});
</script>

这是process.php

    <?php
include('config.php');
    {
    $events = array();
    $query = mysqli_query($con, "SELECT * FROM revent");
    while($fetch = mysqli_fetch_array($query,MYSQLI_ASSOC))
    {
    $e = array();
    $e['id'] = $fetch['id'];    
    $e['start'] = $fetch['start'];
    $e['end'] = $fetch['end'];
    $e['title'] = $fetch['title'];
    $e['dow'] = $fetch['dow'];
    $e['ranges'] = [ array("dowstart" => $fetch['dowstart'],"dowend" => $fetch['dowend'])];
    $e['color'] = $fetch['color'];
    array_push($events, $e);
    }
    echo json_encode($events);
};
?>

这是the relevant table

这是由process.php创建的json

[
  {"id":"1","start":"10:00","end":"12:00","title":"my event1","dow":"2","ranges":[{"dowstart":"2018-06-07","dowend":"2018-06-27"}],"color":"lightgreen"},
  {"id":"2","start":"14:00","end":"18:00","title":"my event2","dow":"0,5","ranges":[{"dowstart":"2018-06-07","dowend":"2018-07-07"}],"color":"lightblue"},
  {"id":"4","start":"14:00","end":"16:00","title":"my event3","dow":"1,4","ranges":[{"dowstart":"2018-06-07","dowend":"2018-07-07"}],"color":"pink"},
  {"id":"5","start":"14:00","end":"16:00","title":"my event4","dow":"1,4","ranges":[{"dowstart":"2018-08-08","dowend":"2018-08-18"}],"color":"pink"}
]

现在正在工作！它需要这一行$ e ['ranges'] = [array（“ dowstart” => $ fetch ['dowstart']，“ dowend” => $ fetch ['dowend']）]];然后我将范围更改为eventRender中的range。

Answer 1

原始代码中有一些小错误：

1）用于创建“范围”数组的PHP是错误的，它将产生一个对象，而不是JavaScript期望的数组。

您的代码产生一个对象：

"ranges":{"dowstart":"2018-06-07","dowend":"2018-06-27"}

当您需要一个包含（一个或多个）对象的数组时：

"ranges":[{"dowstart":"2018-06-07","dowend":"2018-06-27"}]

PHP必须像这样才能生成正确的JSON：

$e['ranges'] = [ array("dowstart" => $fetch['dowstart'],"dowend" => $fetch['dowend'])];

2）以某种方式从原始源复制“ eventRender” JavaScript代码时，您引入了错字，这会导致有关未定义变量的JavaScript错误：

isBefore(ranges.dowend)和isAfter(ranges.dowstart)

应该是

isBefore(range.dowend)和isAfter(range.dowstart)，因为range是传递给“过滤器”回调的范围变量。

更正了这两件事之后，它将可以正常工作。使用示例数据的有效演示：http://jsfiddle.net/qxLuLhsf/98/

全日历，无法使范围有效

1 个答案: