Start Building Professional
Web Apps Today


 
Categories Question details Back To List
Question  posted by Sumeet on Nov 02, 2009 20:31
open dhtmlx forum
dhtmlx Calendar z-index issue

Hi,

I am using dhtmlX calendar however the calendar window pop-ups behind the controls on the form. I have tried using z-index: 999 however no success.

Moreover, I saw the below given link which is on the same kind of issue but not sure how to use the solution provided at the last.
http://www.dhtmlx.com/docs/products/kb/index.shtml?cat=16&q=11876


Can you please help me out in this?


Thanks,
Sumeet
Answer posted by Alex (support) on Nov 03, 2009 01:11

Hello,

which skin do you use ?

For example if you use yahoolike skin, z-index should be increased in the following class:

.dhtmlxcalendar_yahoolike {
   ....

    z-index:9999;
}

If the issue can not be solved, please provide the sample where the problem can be recreated

Answer posted by Sumeet on Nov 03, 2009 03:41

I am using "simplecolorsand" as skin and also used z-index: 999 but still my calendar comes behind the controls on the form.

 

For your reference I have attached two screenshots, State_1 is one in which calendar is closed, State_2 is one in which calendar is open and showing behind the controls

 

Please suggest

Attachments (1)
Calendar States.zip7.96 Kb
Answer posted by Alex (support) on Nov 03, 2009 05:16
Do you use disableIESelectFix ? By default the IE select fix is enabled. But this method disables it and the issue can take place.
If you don't use this method, please provide complete demo (sample) that allows to recreate the issue, and information about browser.
Answer posted by Sumeet on Nov 03, 2009 21:24

Please see the demo code for your reference, hope now you would be able to recreate the problem and would suggest me something on this.

Thanks,

Attachments (1)
Calendar_Demo.zip71.26 Kb
Answer posted by Sumeet on Nov 03, 2009 21:25
I am using IE-6
Answer posted by Alex (support) on Nov 04, 2009 01:23
Hello,

could you  please provide demo that doesn't require any server-side.
Answer posted by Sumeet on Nov 04, 2009 03:33
Here you go...!
Attachments (1)
Calendar_Client.zip50.85 Kb
Answer posted by Alex (support) on Nov 04, 2009 04:58
Please, try to use cal1.show() instead of document.getElementById('calendar1').style.display = '' to display calendar. In this case the problem will be solved.

To hide calendar - hide() method:

    cal1.hide();

Answer posted by Sumeet on Nov 04, 2009 21:39

Althought it has helped me to bring calendar popup up-front however, a white box is coming with the popup.

Any suggestion on that?

Answer posted by Alex (support) on Nov 05, 2009 02:32

Hello,

the white box is the IE6 fix - iframe that allows to show container over the select.

So, there is no way to avoid this box.

It's possible to descrease the size of the iframe - it will be fully hidden by calendar. But in this case a part of the select will overlap the part of the calendar (part without iframe).