FullCalendar fc-more在弹出窗口中显示很多重复项

时间:2019-05-30 20:35:44

标签: jquery fullcalendar

我正在使用FullCalendar,并且在fc-more链接中存在一个永久性错误,该链接显示日历中列出的事件的重复项。底层的mysql调用不会产生重复项。我认为当事件持续多天时,日历中的某些内容会创建重复3。不确定有趣的是,显示为fc-more的数字是准确的,但是一旦单击,弹出窗口就会产生重复项。 fc-more link我已附上几张图像以显示正在发生的事情。我想知道是否有人遇到过popup contents类似问题。

这是生成提要数据的代码

while($row = mysqli_fetch_array($data)) {
    $uniqueid = base64_encode($row['id']);
    $a_json_row["id"] = $row['JobID'];
    $projectid = base64_encode($row['JobID']);
    $company = new Company();
    $company->load($mysqli,$row['CompanyID']);
    $a_json_row["start"] = htmlentities(stripslashes($row['ShowOpen']));
    $a_json_row["end"] = htmlentities(stripslashes($row['ShowClose']));
    $show = htmlentities(stripslashes($row['Show']));
    $project = htmlentities(stripslashes($row['JobID']));
    $mycompany = htmlentities(stripslashes($company->CompanyName));
    $BoothSize = htmlentities(stripslashes($row['BoothSize']));
    if($userid == ''){                       
        $user = new User();
        $user->load($mysqli, $row['AccountManager']);
        $initials = getInitials($user->name);
        $initials = "($initials)";
    }else{
        $initials = '';
    }
    $a_json_row["title"] = "$initials $BoothSize $project"; // $mycompany 

    if($row['Status'] == 7){             
            $a_json_row["color"] = htmlentities("#F1C40F");  // yellow
            $a_json_row["textColor"] = htmlentities('black');             
    }elseif(($row['Status'] == 6)||($row['Status'] == 2)){    
            $a_json_row["color"] = htmlentities("#1a6fad");
            $a_json_row["textColor"] = htmlentities('white');
    }elseif(($row['Status'] == 8)||($row['Status'] == 9)){    
            $a_json_row["color"] = htmlentities("#93AFBF");   // bluish
            $a_json_row["textColor"] = htmlentities('white');
    }elseif($row['Status'] == 4){    
            $a_json_row["color"] = htmlentities("#28B463");  // green
            $a_json_row["textColor"] = htmlentities('white');
    }elseif($row['Status'] == 1){    
            $a_json_row["color"] = htmlentities("#beb098");  // tan
            $a_json_row["textColor"] = htmlentities('white');
    }elseif($row['Status'] == 13){    
            $a_json_row["color"] = htmlentities("#922B21");   // red
            $a_json_row["textColor"] = htmlentities('white');
    }else{    // "Opportunity" = 1
            $a_json_row["color"] = htmlentities("#717D7E");  // gray
            $a_json_row["textColor"] = htmlentities('white');
    }   

    $a_json_row["url"] = "project.php?j=$projectid";
    array_push($a_json, $a_json_row);
}

这是jQuery

$(document).ready(function() {

    $('#calendar').fullCalendar({
        header: {
            left: 'prev,next today',
            center: 'title',
            right: 'month,basicWeek,basicDay'
        },
        defaultDate: (new Date()).toISOString().substring(0, 10),
        navLinks: true, // can click day/week names to navigate views
        editable: true,
        eventLimit: true, // allow "more" link when too many events
        events: 'include/feed.php',
        eventClick: function(event) {
          if (event.url) {
            window.open(event.url);
            return false;
          }
        }
    });

    $('#calendar').fullCalendar({
        events: function(callback) {
            $.ajax({
                url: 'include/feed.php',
                success: function(doc) {
                    var events = [];
                    $(doc).find('event').each(function(){
                        events.push({
                            id: $(this).attr('id'),
                            title: $(this).attr('title'),
                            start: $(this).attr('start'), // will be parsed
                            url: $(this).attr('url'),
                            color: $(this).attr('color'),
                            textColor: $(this).attr('textColor')
                        });
                    });
                    callback(events);
                }
            });
        }
    });       
});

1 个答案:

答案 0 :(得分:0)

要解决此问题,我更改了fullcalendar.js函数,该函数通过在显示重复事件之前将其从弹出窗口中删除来产生日期弹出窗口,代码块大约在8390行。希望这可以帮助其他人节省一些时间。在fullcalendar github页面上看到了类似的bug报告。

原始

resliceDaySegs: function(segs, dayDate) {
  var dayStart = dayDate.clone();
  var dayEnd = dayStart.clone().add(1, 'days');
  var dayRange = new UnzonedRange(dayStart, dayEnd);
  var newSegs = [];
  var i;

  for (i = 0; i < segs.length; i++) {
    newSegs.push.apply(newSegs, this.eventFootprintToSegs(segs[i].footprint, dayRange));
  }
  this.sortEventSegs(newSegs);
  return newSegs;
},

对此

resliceDaySegs: function(segs, dayDate) {
    var dayStart = dayDate.clone();
    var dayEnd = dayStart.clone().add(1, 'days');
    var dayRange = new UnzonedRange(dayStart, dayEnd);
    var newSegs = [];
    var i;

    for (i = 0; i < segs.length; i++) {
        newSegs.push.apply(newSegs, // append
            this.eventFootprintToSegs(segs[i].footprint, dayRange)
        );
    }

    var unique = [];
    var newSegsX = [];

    $.each(newSegs, function(i,el){

        if($.inArray(el.footprint.eventDef.id, unique) === -1){
            unique.push(el.footprint.eventDef.id);
            newSegsX.push(el);
        } 
    });

    this.sortEventSegs(newSegsX);
    return newSegsX;
},