Apex Code Development You need to sign in to do that
Don't have an account?
Gunish 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"> </div>
<div class="dhx_cal_next_button"> </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
Check the styles of the scheduler container http://scheduler-net.com/docs/faq.html
This post may be old.But ,today i faced the same issue.
By setting fixed height for scheduler div solves my problem.
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:
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"> </div> <div class="dhx_cal_next_button"> </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
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"> </div>
<div class="dhx_cal_next_button"> </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>
Has anyone experience with DHTMLX Gantt in Lightning?