Calendar not reloading xml

edwardeddyus · September 27, 2011, 8:21pm

Using prototype I load the calendar content into the page by calling:

postForm(document.forms.mainform,‘subbody’,‘calendar.html’);

/*Generic Function to post a form to the page*/ function postForm (frm,div,url) { if(! div){div="mainbody";} if(! $(div)){return;} if(! frm){frm=document.forms.mainform;} if(url){ frm.action=url; } var frmData = $(frm.id).serialize(true); new Ajax.Updater({ success: div, failure: div }, frm.action, { method: frm.method, onCreate: waiting(div), parameters: frmData, onComplete:postchck } ); return false; }

calendar.html

<div id="_caltabs"></div>
	<div id="appointment_calendar" class="dhx_cal_container" style='width:100%; height:100%;'>
		<div class="dhx_cal_navline">
			<div class="dhx_cal_prev_button">&nbsp;</div>
			<div class="dhx_cal_next_button">&nbsp;</div>
			<div class="dhx_cal_today_button"></div>
			<div class="dhx_cal_date"></div>
			<div class="dhx_cal_tab" name="day_tab" style="right:204px;"></div>
			<div class="dhx_cal_tab" name="week_tab" style="right:140px;"></div>
			<div class="dhx_cal_tab" name="month_tab" style="right:76px;"></div>
		</div>
		<div class="dhx_cal_header">
		</div>
		<div class="dhx_cal_data">
		</div>		
	</div>

I enter an event and it sends to my appointments.cfm and enters the correct data into the database but when I navigate away from the calendar and come back the event is gone. If I use firebug I can see the ajax call was made to the appointments.cfm file and it has the correct xml data but no events show on the calendar.

My Javascript to load the calendar

[code]//Calendar
var reucurringBlocks=new Array();
var generalBlocks=new Array();
function loadcalconfig(){
$(‘subbody’).style.width=document.documentElement.clientWidth + ‘px’;
var step = 5;
var format = scheduler.date.date_to_str("%h:%i");
var curDate = new Date();
scheduler.form_blocks[“my_editor”]={
render:function(sns){
return “

<div style=“width:80px;float:left;”>First Name

<br clear=“all”/><div style=“width:80px;float:left;”>Last Name <br clear=“all”/><div style=“width:80px;float:left;”>Email “;
},
set_value:function(node,value,ev){
node.childNodes[1].value=value||””;
node.childNodes[4].value=ev.details||"";
node.childNodes[7].value=ev.location||"";
},
get_value:function(node,ev){
ev.details = node.childNodes[4].value;
ev.location = node.childNodes[7].value;
return node.childNodes[1].value;
},
focus:function(node){
var a=node.childNodes[1];
a.select();
a.focus();
}
}
scheduler.config.lightbox.sections=[
{ name:“description”, height:200, map_to:“text”, type:“my_editor” , focus:true},
{ name:“time”, height:72, type:“time”, map_to:“auto”}
]
scheduler.templates.event_text=function(start,end,event){
if(event.details){
return "Name: " + event.text + " " + event.details + “”;
}else{
return "Name: "+event.text + “”;
}
}
scheduler.config.details_on_create=true;
scheduler.config.details_on_dblclick=true;
scheduler.config.icons_select=[“icon_details”,“icon_delete”];
scheduler.config.scroll_hour = curDate.getHours();
scheduler.config.hour_size_px=(60/step)*21;

function block_readonly(id){
		if (!id) return true;
		return !this.getEvent(id).readonly;
	}
scheduler.attachEvent("onBeforeDrag",block_readonly)
scheduler.attachEvent("onClick",block_readonly)

scheduler.templates.hour_scale = function(date){
	html="";
	for (var i=0; i<60/step; i++){
		html+="<div style='height:21px;line-height:21px;'>"+format(date)+"</div>";
		date = scheduler.date.add(date,step,"minute");
	}
	return html;
}
scheduler.attachEvent("onEventSave",function(id,data){
	if (!data.text) {
		alert("Please Enter a First Name");
		return false;
	}
	if(!data.details){
		alert("Please Enter a Last Name");
		return false;
	}
	if(!data.location){
		alert("Please Enter a Valid E-mail");
		return false;
	}else{
		return checkemail(data.location);
	}
	return true;
})
scheduler.templates.week_date_class=function(date,today){
	for (var i=0; i<reucurringBlocks.length; i++){
		if(date.getDate()==reucurringBlocks[i][0]  && date.getMonth()== reucurringBlocks[i][1]){
			return "blockeddays";	
		}
	}	
	for (var j=0; j<generalBlocks.length; j++){
		if(date.getDate()==generalBlocks[j][0]  && date.getMonth()== generalBlocks[j][1] && date.getFullYear()== generalBlocks[j][2]){
			return "blockeddays";	
		}
	}
	return "";
}
 scheduler.templates.month_date_class=function(date,today){
	for (var i=0; i<reucurringBlocks.length; i++){
		if(date.getDate()==reucurringBlocks[i][0]  && date.getMonth()== reucurringBlocks[i][1]){
			return "blockedmonthdays";	
		}
	}	
	for (var j=0; j<generalBlocks.length; j++){
		if(date.getDate()==generalBlocks[j][0]  && date.getMonth()== generalBlocks[j][1] && date.getFullYear()== generalBlocks[j][2]){
			return "blockedmonthdays";	
		}
	}
	return "";
}
scheduler.config.xml_date="%Y-%m-%d %H:%i";
scheduler.init('appointment_calendar',null,"day");
scheduler.load("../xml/appointments.cfm?uid="+scheduler.uid());
var dp = new dataProcessor("../xml/appointments.cfm");
dp.init(scheduler);

}[/code]

My xml file geberated by coldfusion

Stanislav · September 28, 2011, 7:26am

navigate away from the calendar and come back the event is gone
Do you mean normal page reloading or some kind of ajax operations ?
In second case the problem can occur - scheduler build in the way which doesn’t allow create few instances of scheduler per page, and if you can scheduler.init second time on the same page - the inner event handlers can be broken.

Basically you need to reload page, or preserve scheduler on existing page instead of reiniting it.

edwardeddyus · September 28, 2011, 1:44pm

Thank you for responding yes I’ve tried both Ajax operations to navigate away using the following when returning to the page

function calendarReload(){
	var randomnumber=Math.floor(Math.random()*1001);
	scheduler.clearAll();
	scheduler.load("../xml/appointments.cfm?uid=" + scheduler.uid() + "&ranID=" + randomnumber);
}

I’ve also just created links to and from the page and still no load. Perhaps what I’m missing is a way to see if the scheduler has been initialized and only call my calendarReload() function if it has. Is there such a method? Can I just do

if(scheduler){calendarReload();}else{loadcalconfig();}

Stanislav · September 29, 2011, 10:00am

You can use

if(scheduler.getState().mode){ calendarReload(); }else{ loadcalconfig(); }

edwardeddyus · October 17, 2011, 3:38pm

Thanks for the help but it still doesn’t seem to be working… calendarReload(); never fires scheduler.getState().mode always returns undefined.

Stanislav · October 18, 2011, 9:03am

getState().mode can be undefined when

a) you are calling it before scheduler.init()
b) you have called scheduler.init() second times ( it must be called only once )

edwardeddyus · October 20, 2011, 3:39pm

I’m calling getState().mode before scheduler.init() to make sure scheduler.init() doesn’t get called twice. The fact that it is returning undefined would tell me it’s working as expected on page load meaning there must be something else causing the data not to load correctly. I noticed if I continuously use the f5 button to reload the page it will eventually load the data correctly. Is there a way to debug the load function so I can see an error when the data doesn’t load?

Stanislav · October 21, 2011, 8:57am

f I continuously use the f5 button to reload the page it will eventually load the data correctly

Most probably you have some timing concurrency between ajax loading and some other parts of code.

Is there a way to debug the load function so I can see an error when the data doesn’t load?
Unfortunately there is no any extra debug options. If some error occurs - scheduler will generate normal js error, which can be catched with dev. tools in normal way.

Can you provide some kind of sample or demo page where problem can be reconstructed?