Search code examples
javascriptphpjquerydhtmlx-scheduler

dhtmlx multiple scheduler not working error "Scheduler is not defined"

I'm implementing dthmlx schedule in my website. On dashboard I need to show three scheduler in tabs. However scheduler in first tab is working but for second scheduler while initiating an object I'm getting error "Scheduler is not defined". Following is my code.

<script type="text/javascript" charset="utf-8">
    function init() {
        scheduler.config.multi_day = true;
        scheduler.config.xml_date="%Y-%m-%d %H:%i";
        scheduler.init('scheduler_here',new Date(2013,0,10),"week");
        scheduler.load("./data/events.xml");

        scheduler1  = Scheduler.getSchedulerInstance();
        scheduler1.config.multi_day = true;
        scheduler1.config.xml_date="%Y-%m-%d %H:%i";
        scheduler1.init('scheduler_here_1',new Date(2013,0,10),"week");
        scheduler1.load("./data/events.xml");
    }

    function show_minical(){
        if (scheduler.isCalendarVisible())
            scheduler.destroyCalendar();
        else
            scheduler.renderCalendar({
                position:"dhx_minical_icon",
                date:scheduler._date,
                navigation:true,
                handler:function(date,calendar){
                    scheduler.setCurrentView(date);
                    scheduler.destroyCalendar()
                }
            });
        if (scheduler1.isCalendarVisible())
            scheduler1.destroyCalendar();
        else
            scheduler1.renderCalendar({
                position:"dhx_minical_icon_1",
                date:scheduler1._date,
                navigation:true,
                handler:function(date,calendar){
                    scheduler1.setCurrentView(date);
                    scheduler1.destroyCalendar()
                }
            });
    }
</script>

<body onload="init();">
   <div id="scheduler_here" class="dhx_cal_container" style='width:50%; 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_minical_icon" id="dhx_minical_icon" onclick="show_minical()">&nbsp;</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>

   <div id="scheduler_here_1" 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_minical_icon_1" id="dhx_minical_icon_1" onclick="show_minical()">&nbsp;</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>

All require files are included properly. What exactly going wrong ?

Solution

  • Be sure that you are using PRO version of dhtmlxscheduler, as only PRO version supports the getSchedulerInstance API.