Custom forms not working

Suite and Optimus Suite 5
#1

Hi Everyone,



Was wondering how to create a custom form for the scheduler tool. Looking in the documentation it says that to make a custom form you need to put code inside:



--------------------------------

scheduler.showLightbox = function(id){

… custom code here

}

--------------------------------



When i place the following code in there:



--------------------------------

var d=document.createElement(“DIV”);

d.className=“dhx_cal_light”;

d.style.visibility=“visible”;

d.innerHTML = “Testing…is it working?”;                        

this.showCover(d);

this._fill_lightbox(id,d);

--------------------------------



When triggerd, only the “cover” (Lightbox shadow effect) is shown but the content is not, i also receive a javascript error:



--------------------------------

“1” is empty or no object

--------------------------------



Can someone please direct me in the right way on how to create a custom form for this wonderful tool.

#2

You are calling the
this._fill_lightbox(id,d);
in your custom code, the method expects to receive a form template as second parameter, not just a custom html container.
You can comment this line and use you own code to get and set data

var event = scheduler.getEvent(“id”)
// event.text - you can access ( get or set ) any event property in such way

#3

Thanks for replaying, i’m not quite sure how to do this. I cannot find " var event = scheduler.getEvent(“id”)" in the exsisting source code, i tried using the code from “source/lightbox.js” but i can not get it to work.

Could you perhaps be so kind to show me a small example… thanks in advance.

#4
#5


OK, i think i have been at this for too long, it was right in front of me… i think i did itm it now shows a box with text:



------------------------------------
  scheduler.showLightbox = function(id){
   var ev = scheduler.getEvent(id);
   var start_date =  ev.start_date;
   var end_date = ev.end_date;



   var d=document.createElement(“DIV”);
   d.className=“dhx_cal_light”;
   d.style.visibility=“visible”;
   d.innerHTML=“I think it is working now…”;
   d.style.display=“block”;
   d.style.top=“200px”;
   d.style.left=“200px”; 



   document.body.appendChild(d);
   scheduler._lightbox_id=id;
  }



------------------------------------



Thanks for the help…

#6

Actually you can ignore any previously used code at all and show the fully custom form. The code may look as


scheduler.showLightbox = function(id){
scheduler.showCover(); //show modal layer

//show custom form
var frm = document.getElementById(“custom_form”);
frm.style.display=“block”;
scheduler.set_xy(frm,300,200,100,100);

//fill custom form with data
var ev = scheduler.getEvent(id);
frm.getElementsByTagName(“INPUT”)[0].value = ev.text;
scheduler._last_custom_id = id; //save id in some temp var
}

Full sample is attached.

1255610629.zip (35.8 KB)