Mobile Toolbar display not allowing new buttons

We’re trying to modify/add some buttons on the toolbars in the Mobile version. We’re having a problem with nothing being changed/added when trying to follow the examples and instructions in the documentation. Here’s the code:


scheduler.config.show_loading = true;

scheduler.config.bottom_toolbar = [
	{ view:"segmented", id:"leftbuttons",selected:"list", align:"left",multiview:true,
			{value:"today", label:scheduler.locale.labels.icon_today,width:scheduler.xy.icon_today},
			{value:"home", label:"Home",width:scheduler.xy.icon_today,click:"goHome"}
	{ view:"segmented", id:"buttons",selected:"list", align:"center",multiview:true,
			{value:"list", label:scheduler.locale.labels.list_tab,width:scheduler.xy.list_tab},
			{value:"day", label:scheduler.locale.labels.day_tab,width:scheduler.xy.day_tab},
			{value:"month", label:scheduler.locale.labels.month_tab,width:scheduler.xy.month_tab}
	{ view:"button",css:"add",id:"add", align:"right",label:" + ",inputWidth:42,width:50},
	{ view:"label", label:"",inputWidth:42,width:50, batch:"readonly"}

//object constructor
    view: "scheduler",
	id: "scheduler",
	save: "/cfc/calendar/dhtmlxCalendar.cfc"

// method load() lets you to populate the scheduler with data



Nothing seems to change on the toolbar no matter what we change. There is a “goHome” function defined but I believe that is irrelevant to the problem. It just does a location.href to the home page on click.

Any ideas or corrections to our code?

This was partially solved by Jeremy in this post: viewtopic.php?f=24&t=28221

Now we get a script error when clicking on one of the buttons stating:
Uncaught TypeError: Cannot call method ‘show’ of undefined dhxscheduler_mobile_rec.js:510

I’ll play around with this a little more next week and hopefully find an answer to the script error.

“segmented” button is used for the navigation in scheduler - it shows a corresponding view in multiview.

Try to use “toggle” as “leftbuttons” view:

scheduler.config.bottom_toolbar = [ { view:"toggle", id:"leftbuttons",value:"list", align:"left", css: "tb_toggle", click:"myFunc", options:[ {value:"today", label:scheduler.locale.labels.icon_today,width:scheduler.xy.icon_today}, {value:"home", label:"Home",width:scheduler.xy.icon_today} ] }, ... ];

In the “toggle” config I set css: “tb_toggle” and click:“myFunc”. The former allows to customize toggle style, the latter sets onclick handler for the button. Here are examples:

.tb_toggle .dhx_inp_toggle_left_on, .tb_toggle .dhx_inp_toggle_left_off {
border-color: #626262 #AFAFAF #626262 #626262;
font-size: 14px;
font-weight: bold;
.tb_toggle .dhx_inp_toggle_right_on, .tb_toggle .dhx_inp_toggle_right_off {
border-color: #626262 #626262 #626262 #AFAFAF;
font-size: 14px;
font-weight: bold;


function myFunc(){ var value = this.getValue(); if(value == "today") $$("scheduler").setDate(new Date()); else goHome(); }