How to display a new event without refreshing page?

Hi, I’m using a custom editor so I’m unable to make use of lightbox event handlers for refreshing events after updating.

What I want to do is to double-click on any empty cell, and then the event handler will figure out if it’s within a particular time period, and alter the event’s dates to predetermined time period (eg. 7:00 to 12:00). Then I’ll open the editor, fill in event data, and then save to database. When the editor close, I would like to see the new event on the scheduler, but I haven’t be able to get the displayed event upon closing editor without refreshing the page yet.

Here is a code sample to help clarify my situation:

scheduler.config.xml_date = "%Y-%m-%d %H:%i";

function timePeriod(ev, start, end) { // format the date according to xml_date
    var year = ev.start_date.getFullYear();
    var month = ev.start_date.getMonth() + 1;
    var date = ev.start_date.getDate();
    var str = year + "-" + month + "-" + date + " ";
    ev.start_date = str + start;
    ev.end_date = str + end;
}

scheduler.attachEvent("onBeforeEventChanged", function(ev, nav_ev, is_new, unmod_ev) {
    if(scheduler.templates.event_date(ev.start_date) >= '07:00' && scheduler.templates.event_date(ev.end_date) <= '12:00') { 
        console.log('morning');
        timePeriod(ev, '07:00', '12:00');
    }
    else if(scheduler.templates.event_date(ev.start_date) >= '12:00' && scheduler.templates.event_date(ev.end_date) <= '17:00') { 
        console.log('afternoon!');
        timePeriod(ev, '12:00', '17:00');
    }
    else if(scheduler.templates.event_date(ev.start_date) >= '17:00' && scheduler.templates.event_date(ev.end_date) <= '23:30') { 
        console.log('night!');
        timePeriod(ev, '17:00', '23:30');
    }
    return true;
});

I can post successfully to the database and retrieve the new event data when I refresh the page. However, I would like to be able to see the new event without having to refresh my page.

I tried using scheduler.updateEvent(id) and scheduler.updateView() in onEventSave, onEventUpdated, and onEventAdded. They were unsuccessful.

Do you have advice for me on how to make this work?

start_date and end_date must be the Date objects, not the strings

[code]function timePeriod(ev, start, end) { // format the date according to xml_date
var year = ev.start_date.getFullYear();
var month = ev.start_date.getMonth();
var date = ev.start_date.getDate();

start = start.split(":");
end = end.split(":");

ev.start_date = new Date(year, month, date, start[0], start[1];
ev.end_date = new Date(year, month, date, end[0], end[1];

}[/code]

Also, I think that onEventCreated may be a bit better than onBeforeEventChanged, as it occurs only for new event creation ( and for all new event creation scenarious )