事件对象在完整日历中保存了以前的事件属性
问题描述:
我遇到了FullCalendar问题,我一直在寻找解决方案,但没有取得任何成功。 我使用eventClick打开当前事件数据的叠加窗体。一切都很好,直到我改变主意,不想编辑这个事件,而是另一个。这导致ajax发送请求2次,一次用于打开的事件(准备编辑但表单未提交),一次用于真正编辑和提交的事件。事件对象在完整日历中保存了以前的事件属性
$('#sc-calendar').fullCalendar({
eventClick: function(event) {
//opening overlay form window
$('#submit-event-update').bind('click',function() { //click submit
$.ajax({
type: "GET",
url: "event_update",
data: "id="+event.id+"&title="+event.title+"&start="+event.start+"&end="+event.end,
cache: false,
success: function() {
$('#submit-event-update').unbind();
$('#sc-calendar').fullCalendar('updateEvent',event);
}
});
});
}
});
这开始是我的噩梦。请帮忙!
答
在我看来,onclick
事件监听器对于#submit-event-update
存在问题。
您应该修改代码以这样的方式
$('#sc-calendar').fullCalendar({
eventClick: function(event) {
//opening overlay form window
//Assign the event id of this event to the global variable event_id
event_id = event.id;
}
});
$('#submit-event-update').bind('click',function() { //click submit
$.ajax({
type: "GET",
url: "event_update",
data: "id=" + event_id + ..., //Note how event.id is not used anymore
cache: false,
success: function() {
$('#sc-calendar').fullCalendar('updateEvent',event);
}
});
});
我改变了它,让你的onclick
事件处理程序绑定到该按钮只有一次,而不是每一个被点击的事件时间。我还分配了一个变量event_id
,它保存当前事件ID的值。
现在,作出解释。你说:
一切工作的很好,直到我改变主意,不想编辑 这个事件,但另一个。
当你点击一个事件会发生什么?
您将onclick
事件绑定到#submit-event-update
。现在,如果你点击按钮,那么你将进入你的AJAX调用的success()
回调,然后解除绑定按钮。但是如果你改变了主意并且不点击提交按钮呢?现在,您有一个onclick
侦听器,旧数据已绑定到该按钮。当你选择另一个事件时,你有两个事件监听器绑定到同一个按钮,因此,AJAX请求发送两次。
阅读JavaScript如何处理事件绑定here可能是值得的。
这是相当不错的解决方案。但是,如果我有另一个属性,我在窗体中更改它不会更改日历或日历初始化。 – mesnicka 2013-05-13 12:06:22