- This topic has 11 replies, 2 voices, and was last updated 12 years, 3 months ago by
.
-
Posts
-
Hello,
Can anybody help me with this ?
I am trying to integrate the following scheduler into MobiOne.http://www.dhtmlx.com/docs/products/dhtmlxScheduler/sample_mobile.shtml
I manage to get it running and it looks good but I put it on a page of a Multipage Widget. So normally the scheduler should only appear when i select the tab Item from the TabBar that is linked with the multipage Widget…
But the scheduler inits directly and shows non-modal on top of the whole app ?
So I post a question on the forum of the dhtmlx components and they replied this:Hello,
Scheduler can be initialized in full-screen mode or rendered in a certain container, as in:
<style> #schedulerDiv{...} </style> ... <div id="schedulerDiv"></div> ... dhx.ready(function(){ dhx.ui({ view: "scheduler", id: "scheduler", container: "schedulerDiv" }); ... });Scheduler can be created on some action, for example on button click:
someButton.onclick = function(){
dhx.ui({
view: “scheduler”,
id: “scheduler”,
container: “schedulerDiv”
});
}I can see what they mean but I don’t know where the style and div definitions have to come ? What has to come between the accolades of the #schedulerDiv?
Can anyone help me out ?
thank you,
Olivier
I now have this code on a html widget on a panel on a page from a multipage widget:
<!DOCTYPE html> <html> <head> <meta name = "viewport" content = "initial-scale = 1.0, maximum-scale = 1.0, user-scalable = no"> <script type="text/javascript" charset="utf-8"> scheduler.config.init_date = new Date(2011,5,12); dhx.ready(function(){ dhx.ui({ view: "scheduler", id: "scheduler" }); $$("scheduler").load("data/mobile.xml","scheduler"); $$("scheduler").data.attachEvent("onAfterAdd",function(id){ dhx.alert("Item '"+this.item(id).text+"' has been added"); }); $$("scheduler").data.attachEvent("onAfterDelete",function(id){ dhx.alert("Item has been deleted"); return true; }); $$("scheduler").data.attachEvent("onStoreUpdated",function(id,item,operation){ if(operation == "update") dhx.alert("Item '"+this.item(id).text+"' has been updated"); return true; }); }); </script> </head> <body> </body> </html>I effectively imported the calendar in a test project. My advise is dont use the html header files in your widget.
You will have to change the script sources for the project to where yours are.
@CincyPlanet wrote:
I effectively imported the calendar in a test project. My advise is dont use the html header files in your widget.
You will have to change the script sources for the project to where yours are.
OKe, I added a multipage with tabbar to your test project and it works ! thank you
BUT I am working with the mobile version of this suite and this has different functions which I don’t understand…http://www.dhtmlx.com/x/download/regular/dhtmlxScheduler_mobile.zip
there is no <style> of <div> defined and it works with this dhx.ready function ? I can only get it to work fullscreen !
Can you maybe make another test project working with the mobile version of the dhtmlx suite ?
thank you so much,
Olivier
@isurgeon
I updated the file to use the mobile version instead of the full version, I included the code from the data_saving sample file.@CincyPlanet wrote:
@isurgeon
I updated the file to use the mobile version instead of the full version, I included the code from the data_saving sample file.Thanx very much, but when I download the file you attached in your previous mail it seems to be exactly the same file ? Where did you put your mobile updated version ?
thank you for your kind help,
Olivier
@CincyPlanet wrote:
Try this one:
Alas ! Scheduler works nicely, but immediatly starts and gets on top fullscreen so my tabbar and multipage is not visible anymore ?
Should we use a div area somewhere here ?Omitting the fullscreen command does not change anything…
when i add this div section it does not show up at all ?
<div id="schedulerDiv"></div> <script type="text/javascript" charset="utf-8"> scheduler.config.init_date = new Date(2009,4,25); dhx.ready(function(){ dhx.ui({ view: "scheduler", id: "scheduler", container: "schedulerDiv", save: "data/events.php" }); $$("scheduler").load("data/events.php","json"); }); </script>Not some where I can test it but you can try setting the css value for the width and height for either the container div or in the ready function .
@CincyPlanet wrote:
Not some where I can test it but you can try setting the css value for the width and height for either the container div or in the ready function .
starting to pull my hair out 😉
i’ve added this to the CSS file
.schedulerDiv div { width:28px; height:29px; top:6px; background-image:url(./imgs/images.png); background-repeat:no-repeat; background-position:0 -106px; right:5px; }still does not work 🙁
try teh css in their dhx.ui function and see if that makes a difference. If not it may be something in their main codebase, I would email them about it.
