How to refresh the scheduler after changing config?

In the API docs it says the init() method should be called only once.

If I have updated some config variables, or added units to the scheduler etc., what is the correct way of updating it so these are taken into account?



That depends on what you’ve done.
If it is scheduler.config options or units in units/timeline view then simply refreshing your current view will do:


If you updated list of options in lightbox form then you need to reset it:


Kind regards,


When I add a new timeline resource to the y-axis on the server side (I just add a row to the mySQL dB).


This doesn’t seem to reload the y-axis values.


This seems to have worked;

scheduler.clearAll(); scheduler.setCurrentView(null, "timeline");

Can I make either of these calls blocking? I don’t want a button to be clickable until the data has fully loaded (the loading.gif dissapears and all the data is shown on the timeline view).




Aren’t you losing all events with scheduler.clearAll()?

So you’ve changed data on the server side. In such case you can make synchronous AJAX call to fetch list of new resources, update timeline options and refresh view.
Scheduler comes with dhtmlxAjax component included, you can use it if needed.

Kind regards,

Yes I am. But then the ‘loading.gif’ appears, and it reloads the events/timeline options.

Could you give me a bit of an example on what code I would use in terms of the scheduler refreshing? What is the general run-down of how I should do it? IE; how do I ‘refresh timeline options’, and ‘update current view’?

Running this;


Does nothing… So I must be missing the bit where I update the options. I tried using;

scheduler.updateCollection("units", new_sections_array);

But the example only shows how to do it with ‘units’, so I was unsure of how to do it with ‘timeline’ (y-axis/property names etc).

I’ll take a look at dhtmlxAjax tonight.

Sorry, but… Bump?


Mm… clearAll() doesn’t reload events, it simply resets internal _events array and removes all already rendered events.

updateCollection on the other hand changes corresponding options and refreshes current view.

The same way: scheduler.updateCollection(‘timeline_options’, your_new_array_with_options);
where timeline_options is the name of serverList used for options.

If it still doesn’t work for you please create small sample with all used files so I could check your code and make suggestions.

Kind regards,

I have the following;

[code]var timeline_options = scheduler.serverList(“section_id”);

section_autoheight: false,
name: “timeline”,
x_unit: “day”,
x_date: “%D, %d %M”,
x_step: 1,
x_size: 7,
y_unit: timeline_options,
y_property: “section_id”,
render: “bar”,
dy: 50

Which is used in the lightbox here;

scheduler.config.lightbox.sections=[ {name:"shift", height:20, type:"select", options:work_type, map_to:"work_desc", focus:true }, {name:"notes", height:50, type:"textarea", map_to:"text_desc" }, {name:"employee", height:20, type:"select", options:timeline_options, map_to:"section_id" }, {name:"recurring", height:115, type:"recurring", map_to:"rec_type", button:"recurring"}, {name:"time", height:72, type:"time", map_to:"auto"} ]

And when I add a new person to the database, I’d like to update the timeline (y-axis) coloumn. I tried;

scheduler.updateCollection('timeline_options', scheduler.serverList("section_id"));

But still no luck.

I want to reload timeline with new config parameters such as x_step and x_size

can you please suggest me way to do that
current parameters are :

	section_autoheight: false,
	name:	"timeline",
	x_unit:	"hour",
	x_date:	"%H:%i",
	x_step:	3,
	x_size: 48,
	x_start: 00,
	x_length: 48,
	y_unit: elements,
	y_property:	"section_id",
	render: "tree",

want to change x_step and x_size

this is my code:: in this code my call all value using ajax like sections value, events value
how we refresh or reload automatically the timeline and unit and lightbox section value automatically. what is add or change in my code i fullfill my requirement
function init(){
scheduler.config.multi_day = true;
scheduler.config.xml_date = “%Y-%m-%d %H:%i”;
scheduler.config.details_on_create = true;
scheduler.config.details_on_dblclick = true;
scheduler.config.drag_resize = false;"%Y-%m-%d %H:%i");
scheduler.locale.labels.section_custom = “Event”;
scheduler.locale.labels.timeline_tab = “Timeline”;
scheduler.locale.labels.unit_tab = “Unit”;
scheduler.locale.labels.section_color_name=‘Event Color’;
scheduler.config.hour_size_px = 90;
scheduler.config.first_hour = 9;
scheduler.config.last_hour = 18;
scheduler.config.time_step = 10;
scheduler.config.auto_end_date = true;

	return event.color;
	name : "timeline",
	x_unit : "minute",
	x_date : "%H:%i",
	x_step : 60,
	x_size : 9,
	x_start : 9,
	x_length : 17,
	y_unit : sections,
	y_property : "section_id",
	dy: 163, 					//change the height of cells in timeline view
            section_autoheight: false,
            render : "bar",		
	name: "unit",
	property: "section_id",
	list: sections,		
	size:3,				//how many event show in page
	step:2				//how many previous page event forward in next page

//Data loading
scheduler.config.lightbox.sections =[ {
	name : "custom",
	height : 23,
	type : "select",
	options : sections,
	map_to : "section_id"
}, {
	name : "time",
	height : 72,
	type : "calendar_time",
	map_to : "auto"
}, {
	name : "description",
	height : 130,
	map_to : "text",
	type : "textarea",
	focus : true
}, {
	name : "color_name",
	height : 20,
	map_to : "color",
	type : "select",
	options : [ {key : "pink",label : "pink"
	} , {key : "orange",label : "orange"
	}, {key : "darkpink",label : "darkpink"
	}]}, ];
scheduler.init('scheduler_here', new Date(), "timeline");
scheduler.parse(dataEvents,"json");        //call by ajax
var dp = new dataProcessor("ControllerServlet");

you can use scheduler.serverList and scheduler.updateCollection methods,
please check following articles … rlist.html … ction.html