ID of an event (Fullcalendar)

ID of an event (Fullcalendar)

本文关键字:Fullcalendar event of an ID      更新时间:2023-09-26

我需要添加一个id到每一个事件从Fullcalendar,我发现这个http://arshaw.com/fullcalendar/docs/event_data/Event_Object/,但我不知道如何,这个id是
对于每个事件都是唯一的,因为我将事件保存在Mysql数据库中。由于

我找到解决方案了!当你创建任何事件时,把你的唯一id放在这里:

var shift = calendar.fullCalendar('renderEvent',
        {
            id: shift_id,
            title: current_name,
            start: new Date(y, m, d + current_day, current_start_time_h, current_start_time_m),
            end: new Date(y, m, d + current_day, current_end_time_h, current_end_time_m),
            allDay: false
        }, true // make the event "stick"
        );

之后,这个监听器在DOM结构中附加ID:

     eventAfterRender:function( event, element, view ) { 
$(element).attr("id","event_id_"+event._id);
},

获取一个字段的所有事件:

console.log(calendar.fullCalendar('clientEvents'));

现在你有了一个事件数组,所有的事件都在DOM结构中编号!

明确解决方案是

当你获取事件与Ajax也分配"id",来自DB

id: entry.id

$.ajax({ 
    url: '/eventsJson', 
    type: 'GET', 
    data: { }, 
    error: function() {
        alert('there was an error while fetching events!');
    } 
}).done(function (doc) { 
    var event = Array();
    $.each(doc, function(i, entry) {
        event.push({id:entry.id, title: entry.title, start: entry.start});
    });

事件点击

eventClick: function(event, jsEvent, view) {
               var title = prompt('Event Title:', event.title, { buttons: { Ok: true, Cancel: false} });
           if (title){
           event.title = title;
           var data = {
                'title':title
            };
           $.ajax({
             url: '/events/'+event.id,
             data: data,
             type: 'POST',
             dataType: 'json',
             success: function(response){
               if(response.status == 'success')
               $('#calendar').fullCalendar('updateEvent',event);
             },
             error: function(e){
               alert('Error processing your request: '+e.responseText);
             }
           });
           }
        }

Event对象的ID为可选字段。您可以返回并使用您希望从服务器端脚本返回的任何内容。您可以从多个字段的组合中创建复合ID…'calendarName_eventID'或者直接使用数据库中的eventID。但是,不确定是否希望这样公开主键(这是另一个问题)。长话短说……你可以创建自己的ID值。

你可能想在这里看看:https://code.google.com/p/fullcalendar/issues/detail?id=713

线程处理删除日历事件,但说明了原始海报如何在他/她的保存事件的回调中设置ID。

希望对大家有帮助。

好的,这是我的解决方法。首先,我从数据库中获取最后一个id事件I + 1到最后一个id

<?php
$sql = mysql_query("SELECT id FROM calendar ORDER BY id DESC LIMIT 1");
$resul = mysql_fetch_row($sql);
$idActual = $resul[0];
$idActual = $idActual + 1;
?>

然后我发送id给JS

var idActual = "<?php echo $idActual ?>";

正如fletch提到的,您必须为数据库中的每个新事件或使用数据库连接代码生成ID,以便允许并发。Bryan Villafañe使用了类似的方法,但这是我的解决方案。

对于FC javascript:

select: function(start) { //executed when clicked on a day
    var title = prompt('Event title:');
    if (title) {
        $.ajax({
            url: '/events.php',
            data: 'title='+title+'&start='+moment(start).format('YYYY-MM-DD'),
            type: "POST",
            success: function(id) { 
                console.log(id); //used for debug
                if (!isNaN(id)){ //on success checks the result 
                    event = {    //and adds the event locally with the returned DB id.
                        title: title,
                        start: start,
                        team: team,
                        id: id
                    }//then renders the new event
                    $('#calendar').fullCalendar('renderEvent', event, true);
                }
            },
            error: function(error){
                console.log(error);
            }
        });
    } //unselects the clicked day
    $('#calendar').fullCalendar('unselect');
}

这会以YYYY-MM-DD格式发送日期,因为我只使用allDay事件,但是您可以适当地更新。仅发送start将导致epoch时间以毫秒为单位。

如果插入成功,DB返回行ID,然后将其分配给本地创建的事件并呈现。下面是DB函数:

$result = "Wrong parameter combination!";
if ($_POST[title]&&$_POST[start]) {
    $result = $db->exec("INSERT INTO events (title, start) VALUES ('$_POST[title]','$_POST[start]')");
    if($result==1){
        $result = $db->lastInsertRowID();
    }
}
echo $result;

这里检查两个POST参数并执行插入操作。如果插入成功,我得到最后插入行ID并将其返回给JS。否则返回错误信息。

我使用SQLite3为我的DB,但MySQL的最后插入行可以检查如下所示。有人在插入和最后一行ID检查之间插入另一个事件的可能性很小,但除非您正在运行高流量事务,否则不会有问题。

每个事件都有自己唯一的id:

eventClick: function(event){
    alert(event._id);
}

我建议您在参数中设置类似于这样的参数id:

$('#calendar').fullCalendar({
  id: 'calendar',
  eventReceive: function(event) {
    alert(this.calendar.options.id);
  },
  eventDrop: function(event) {
    alert(this.calendar.options.id);
  },
  eventClick: function(event) {
    alert(this.calendar.options.id);
  },
  eventRender: function(event) {
    alert(this.calendar.options.id);
  }
});

setProp是推荐的,因为v5希望这有助于其他人,我意识到它正在改变arg.event._def中的id。id attr .

我在我的ajax成功中使用了这个

          success: function (response_data) {
        arg.event.setProp("id", response_data['eventId'])}