In my implementation of the scheduler I has a few issues on the above events any help appreciated.
Note: I am converting these events to JSON to transportation to the server.
onBeforeEventDelete
If the user opens the lightbox and deletes an event as their first action I would like not to call the server – is there anything I can check to make this happen ?
On onEventAdded I check
if (event.text.length > 200) {
alert("Text field must not exceed 200 characters");
scheduler.endLightbox(false);
return false;
}
However for onEventChanged I would like to return to the lightbox display before the change was made – is this possible ?
On onBeforeEventDelete I check
if (req.status != 200) {
alert("Error sending data to network - Delete");
return false;
}
However if the server has not acknowledged the successful deletion I would like to return to the previous lightbox display – is this possible ?
You can check internal property scheduler._new_event - if true then it’s new event being deleted. In the upcoming version it will be possible to access it’s value with getState() function.
Then you need to move your logic to the onEventSave event.
No, at this point lightbox is closed already. However you can try to open it once again.
scheduler.attachEvent("onBeforeEventDelete", function(event_id, event_object) {
if(scheduler._new_event){
// event is new, was not saved before, do custom stuff here
}
else {
// event was saved before, apply different logic
}
return true; // confirm event deletion
});
For sending updated event to the server side - sure. But if you simply want to check what user has entered in lightbox and if it is correct information then it would be better to use ‘onEventSave’ as if you return false there - lightbox won’t be closed and user could change entered information.
What I have done is as you suggested moved the validation to the onEventSave and returned false if the validation fails – this leaves the lightbox open so the validation has to be corrected before the user can continue.
However for the failure to send to the server I have done the following.
For onEventAdded:
if (req.status != 200) {
alert("Error sending data to network - Add");
scheduler.endLightbox(false);
return false;
}
As this is an ‘add’ this seems ok and the user can just try again from the beginning.
For onBeforeEventDelete:
if (req.status != 200) {
alert("Error sending data to network - Delete");
return false;
}
Which leaves the event in the calendar – again the user can try again.
However the problem I have is with onEventChanged:
At present I do:
if (req.status != 200) {
alert("Error sending data to network - Change");
return false;
}
But this leaves the new text and as far as the user is concerned it looks as if the change has succeeded.
I would like to return the contents of the lightbox to before the change (as it failed) but I do not see how to do this.
onEventChanged occurs when event has already been changed in scheduler (and lightbox form is closed). What you can do:
Save initial event properties (in onEventSave event) in some kind of global-hidden variable, e.g. scheduler._initial_values
If request failed in onEventChanged event then restore event properties to their original values (simply assign them) and open lightbox for that event again (initial values will be displayed there).
I am sorry, actually lightbox is still open when onEventChanged event occurs and will be closed somewhere down the call stack.
But you can try following:
scheduler.attachEvent("onAfterLightbox", function (){
if(scheduler._reopen_lightbox) {
scheduler.showLightbox(scheduler._reopen_lightbox);
scheduler._reopen_lightbox = false;
}
});
scheduler.attachEvent("onEventChanged", function(event_id, event_object) {
var ev = scheduler.getEvent(event_id);
// all following logic should be applied if request to the server failed
if(scheduler.getState().lightbox_id) // if lightbox is displayed (as event could be changed without lightbox)
scheduler._reopen_lightbox = event_id; // save event_id for future use in afterLightbox
else
scheduler.showLightbox(event_id);
});
Also note that showLightbox expects event_id, not event object.
The only problem I could see after implementing / testing this is that if the change fails and then the event is cancelled the display shows the changed but not saved event.
I believe the only option is to save previous data in onEventSave and restore it if save to the database has failed.
So basically if you use lightbox:
onEventSave - user tries to save event, here’s previous data, here’s new one, should we save it?
onEventChanged - event was changed on the client-side, should we do something else?
scheduler.attachEvent("onEventChanged", function(event_id,event_object){
var event = scheduler.getEvent(event_id);
// Logic to send to server.
// On failure to send:
if (req.status != 200) {
alert("Error sending data to network - Change");
event = scheduler._storeEvent;
if(scheduler.getState().lightbox_id) {
// save event_id for future use in afterLightbox
scheduler._reopen_lightbox = id;
}
else
{
scheduler.showLightbox(id);
}
return false;
});
Is there a better way to store the event rather than doing each individual field ?
When the failure action takes place the lightbox (both the open and closed version) still have the ‘changed’ data displayed - I thought updating ‘event’ would be good enough to get this updated but it is not.
You need to make copy of an object so yes, one way or another you will need to copy it’s properties. Please also note that you want to have new Date objects:
scheduler._storeEvent = {
text: event.text,
start_date: new Date(event.start_date),
end_date: new Date(event.end_date),
rec_type: event.rec_type,
pid: event.event_pid,
length: event.event_length,
};
You haven’t updated event:
event = scheduler._storeEvent;
changes link which is stored in event variable to the link in scheduler._storeEvent (which points to the stored object).
You need to either change it per property:
event.text = scheduler._storeEvent.text
or
scheduler._events[event.id] = scheduler._storeEvent; // change link to the object in the initial
array