我需要为Fullcalendar中的每个事件添加一个id,我发现这个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结构编号!
正如fletch所提到的,您必须为数据库中的每个新事件生成ID,或者使用数据库连接代码生成ID以允许并发。 BryanVillafañ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
将导致纪元时间以毫秒为单位。
如果插入成功,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作为我的数据库,但可以检查最后插入的MySQL行如here所示。有人在您的插入和最后一行ID检查之间插入另一个事件的可能性很小,但除非您正在运行高流量事件,否则您将没事。
Event对象上的ID是可选字段。您可以返回并使用您希望从服务器端脚本返回的任何内容。您可以从字段组合中创建复合ID ...'calendarName_eventID'或只是使用数据库中的eventID。虽然不确定你是否想要公开你的主键(这本身就是另一个问题)。长话短说...你可以创建自己的ID值。
你可能想看看这里:https://code.google.com/p/fullcalendar/issues/detail?id=713
该线程涉及删除日历事件,但说明了原始海报如何在他/她的保存事件的回调中设置ID。
希望这很有帮助。
好的,这是我的解决方案。首先,我从我的数据库中获取最后一个id事件,并且我将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 ?>";
就是这样。
明确解决方案是
当您使用Ajax获取事件时,还要分配来自DB的“id”
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);
}
});
}
}
每个活动都有自己唯一的ID:
eventClick: function(event){
alert(event._id);
}
我建议你在类似于这个的参数中设置param 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);
}
});