Start Building Professional
Web Apps Today


 
Categories Question details Back To List
Question  posted by Alexey Minakov on Mar 13, 2008 08:21
open dhtmlx forum
dhtmlxCalendar + dhtmlxCombo

I have an input box with a popu calendar attached. And two dhtmlxCombos below it. When the popup calendar is shown, it is overlapping those combos. But the combos are showing on the top of calendar. Why so?
Answer posted by Support on Mar 13, 2008 09:00
Most probably problem caused by some specific of your HTML layour ( at least it can't be reconstructed with local samples )
Please try to increase z-index of calendar, it can be adjusted at dhtmlxcalendar.css

.dhtmlxcalendar {
    background: url(imgs/cal_bg_single.png) no-repeat;
    border: 0px solid green;
    font-family: Arial;
    z-index:99;
Answer posted by Alexey Minakov on Mar 14, 2008 04:46
I've made a simple test page to show this effect. It doesn't have any complicated layout or formatting, but this bug is still present. Changing z-index in dhtmlxcalendar.css didn't help.

<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>Untitled Page</title>
     <link rel="STYLESHEET" type="text/css" href="codebase/dhtmlxcalendar.css">
    <link rel="STYLESHEET" type="text/css" href="codebase/dhtmlxcombo.css">
    <script  src="codebase/dhtmlxcommon.js"></script>
	<script src="codebase/dhtmlxcombo.js"></script>
	<script  src="codebase/dhtmlxcalendar.js"></script>
</head>
<body>

<div id="container" style="width: 200px; height: 200px;">
<input type="text" id="cal" /><br /><br />
<table>
<tr>
<td>Addd: </td><td><select id="sel" style="width: 200px;" ></select></td>
</tr>
</table>
</div>

<script language="javascript">
window.dhx_globalImgPath="codebase/imgs/";
var calendar = new dhtmlxCalendarObject('cal', true);
var client_combo = dhtmlXComboFromSelect('sel');
client_combo.clearAll();
client_combo.addOption('test','test');
client_combo.addOption('sint','sint');
</script>

</body>
</html>

Answer posted by Support on Mar 14, 2008 07:39
Please be sure that image folders contains all necessary images from original package.
Calendar uses image as background ( described in dhtmlxgrid.css ) and if file missed ( or location of image folder relative to css file change ) - it will be shown without bg, which may look as combo overlapping calendar.


Attachments (2)
_works.png10.61 Kb
1205506153.zip34.03 Kb