+ Start a Discussion
Gunish Rai ChawlaGunish Rai Chawla 

dhtmlx scheduler not rendering

Hey Guys,

 

I was playing around with DHTMLX Scheduler today and could not get it to render. All I get is a blank page. I checked the JS and CSS References, and everything seems to be in order, The resources are accessed correctly. 

Has anyone attempted this before ?

 

Here is the code I used.

 

<apex:page>
  <apex:form id="theForm">
     <apex:includeScript value="{!URLFOR($Resource.dhtmlxScheduler, 'dhtmlxScheduler/codebase/dhtmlxscheduler.js')}"  />
     <apex:stylesheet value="{!URLFOR($Resource.dhtmlxScheduler, 'dhtmlxScheduler/codebase/dhtmlxscheduler.css')}"/>
	
    <script type="text/javascript" charset="utf-8">
	function initz() {
		
		scheduler.config.multi_day = true;
		
		scheduler.config.xml_date="%Y-%m-%d %H:%i";
		scheduler.init('scheduler_here',new Date(2010,0,10),"week");
		scheduler.load("{!URLFOR($Resource.dhtmlxScheduler, 'dhtmlxScheduler/samples/01_initialization_loading/data/events.xml')}");
		
	}
</script>
<body onload="initz();">
	<div id="scheduler_here" 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>
</body>
    
    </apex:form>
</apex:page>

 Many Thanks in advance.

 

-Gunish

DmixDmix

Check the styles of the scheduler container http://scheduler-net.com/docs/faq.html

Gokulakrishnan MGokulakrishnan M

This post may be old.But ,today i faced the same issue.
By setting fixed height for scheduler div solves my problem.
AlbertoEmpauaAlbertoEmpaua
Hi everyone,
I'm interested in apply the DHTML Scheduler in my Salesforce Org but i have the problem that is not rendering correctly. I read in other forums that the problem is th width of the "scheduler_here" div that I assigned a fixed measure.
But now what I can see is that:
User-added image

The code is very simple I'm only trying to test this possibility and the customize it.
Code:
<apex:page Controller="ResourcesPlanningController">
<head>
	<meta http-equiv="Content-type" content="text/html; charset=utf-8"/>
	<title>Basic initialization</title>
</head>
	<apex:includeScript value="{!URLFOR($Resource.Scheduler, 'codebase/dhtmlxscheduler.js')}"/>	
	<apex:stylesheet value="{!URLFOR($Resource.Scheduler, 'codebase/dhtmlxscheduler.css')}"/>

	
<style type="text/css" media="screen">
	html, body{
		margin:0px;
		padding:0px;
		height:100%;
		overflow:hidden;
	}	
</style>

<script type="text/javascript" charset="utf-8">
	function init() {
		scheduler.config.xml_date="%Y-%m-%d %H:%i";
		scheduler.init('scheduler_here',new Date(2015,0,10),"week");
		scheduler.load("{!URLFOR($Resource.Scheduler, 'samples/01_initialization_loading/data/events.xml')}");
		
		
	}
</script>

<body onload="init();">
	<div id="scheduler_here" class="dhx_cal_container" style='width:100%; height:10em;'>
		<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>
</body>
</apex:page>

If anyone can tell me why is happening that he will help me a lot.

Thanks and Regards,
Alberto
siddhraj atodariasiddhraj atodaria


Dhtmlx Event Scheduler in Salesforce

Please refer below code :

<apex:page >
<head>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8"/>
    <title>Basic initialization</title>
</head>
<apex:includeScript value="{!URLFOR($Resource.dhtmlx, 'dhtmlx/codebase/dhtmlxscheduler.js')}"/> 
<apex:stylesheet value="{!URLFOR($Resource.dhtmlx, 'dhtmlx/codebase/dhtmlxscheduler.css')}"/>
<style type="text/css" media="screen">
    html, body{
        margin:0px;
        padding:0px;
        height:100%;
        overflow:hidden;
    }   
</style>
<body>
    <div id="scheduler_here" class="dhx_cal_container" style='width:90%; height:500px;'>
        <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>
</body>
<script type="text/javascript">
        scheduler.init('scheduler_here',new Date(2016,3,21),"month");
        var events = [
                        {id:1, text:"Meeting",   start_date:"04/11/2016 14:00",end_date:"04/12/2016 17:00"},
                        {id:2, text:"Conference",start_date:"04/18/2016 12:00",end_date:"04/19/2016 19:00"},
                        {id:3, text:"Interview", start_date:"04/24/2016 09:00",end_date:"04/25/2016 10:00"}
                    ];
        scheduler.parse(events,"json");
 </script>
</apex:page>
Prasad Kulkarni 49Prasad Kulkarni 49
Is it possible to implement the dhtmlx scheduler in lightning component?
 
David Roberts 4David Roberts 4
@Prasad: Did you get anywhere? I may be able to help as I've implemented their Gantt module in Lightning so the principal should be the same. However, I have hit a snag:- I've done the basics and got data from the server but I get stuck in dragging a task. It hangs until I swap web tabs.
Has anyone experience with DHTMLX Gantt in Lightning?