Start Building Professional
Web Apps Today


 
Categories Question details Back To List
Question  posted by Jeremy on Jan 08, 2010 03:02
open dhtmlx forum
combobox in scheduler

Hi

I'm trying to put together a 'wizard' tab to add multiple events in one go. The problem I am having is getting filtering combo boxes working. These work fine in FF but IE will selects the first item which matches. In the cut down example, this is shown by selecting bah which should allow Bahamas and Bahrain. Moving the code into a page without the scheduler and it works fine.

Please email me for mor information


--------------
attachment
-------------

<html xmlns:xs="http://www.w3.org/2001/XMLSchema">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>Calendar</title>

<link rel="STYLESHEET" type="text/css" href="/dhtmlx/dhtmlxScheduler/codebase/dhtmlxscheduler.css" >
<link rel="STYLESHEET" type="text/css" href="/dhtmlx/dhtmlxScheduler/codebase/ext/dhtmlxscheduler_ext.css">

<link rel="STYLESHEET" type="text/css" href="/dhtmlx/dhtmlxCombo/codebase/dhtmlxcombo.css">
<link rel="STYLESHEET" type="text/css" href="/dhtmlx/dhtmlxCalendar/codebase/dhtmlxcalendar.css">


<script>

window.dhx_globalImgPath = "/dhtmlx/dhtmlxCalendar/codebase/imgs/";

</script>


<script src="/dhtmlx/dhtmlxGrid/codebase/dhtmlxcommon.js"></script>
<script src="/dhtmlx/dhtmlxCombo/sources/dhtmlxcombo.js"></script>
<script src="/dhtmlx/dhtmlxScheduler/codebase/dhtmlxscheduler.js"></script>
<script src="/dhtmlx/dhtmlxCalendar/sources/dhtmlxcalendar.js"></script>

<script>

    scheduler.locale.labels.wizard_tab = "Wizard";

    scheduler.attachEvent("onXLE",function(){
        if (this._mode != "wizard") return;
        this.wizard_view(true);
    });
    

var clear = scheduler.clear_view;
scheduler.clear_view = function(){
    if (this._mode!="wizard") return
    clear.apply(this,arguments);
}



scheduler.attachEvent("onSchedulerResize",function(){
if (this._mode == "wizard"){
//this.wizard_view(true);
return false;
}
return true;
});


scheduler.wizard_view=function(mode){
var b = scheduler._els["dhx_cal_data"][0];

scheduler._els["dhx_cal_header"][0].style.display=mode?"none":"";
scheduler.set_sizes();

if (this._load_mode && this._load()) return;

if (mode){
scheduler._reset_wizard_scale();
}

b.innerHTML = "";

    
var wizhtml = "<div><form>";
wizhtml += "<br>Date <div id='calInput1' style='width:500px height:150px'></div>";
wizhtml += "<br><hr>This box here doesn't work<br><div id='exec1'></div>";


wizhtml += "</form></div>";

b.innerHTML = wizhtml;

window.dhx_globalImgPath = "/jm/imgs/";

var ex = new Array();

ex[0] = new dhtmlXCombo("exec1", "ex1", "200px");

ex[0].enableFilteringMode(true, "comp.xml", false, false);

ex[4] = new dhtmlxCalendarObject('calInput1');

}

scheduler.wizard_set_xy=function(node,w,h,x,y){
    node.style.width=Math.max(0,w)+"px";
    node.style.height=Math.max(0,h)+"px";
    if (arguments.length>3){
        node.style.left=x+"px";
        node.style.top=y+"px";    
    }
}



scheduler._reset_wizard_scale = function(){
this._cols=[]; this._colsS={};
var week_starts = []; //start day of first week in each month
var hh=this._els["dhx_cal_header"][0];
var b=this._els["dhx_cal_data"][0];
this.xy._wizardscale_width = 150;

var col_height = 21;
var header_height = 18;

var c = this.config;
b.style.top =23;
b.innerHTML="";
}




function schedule_load(){
    scheduler.config.xml_date="%Y-%m-%d %H:%i";
    scheduler.init('scheduler_here',null,"wizard");
    scheduler.setLoadMode("month");
    

}



</script>
</head>


<body onload="schedule_load();">

<div class="myhead"></div>

<div id="sched" name="Scheduler">
    <div id="scheduler_here" class="dhx_cal_container" style="width:100%; height:100%;background-color:#f5f5f5;border :1px solid Silver;overflow:auto">
        <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="wizard_tab" style="right:526px;"></div>
        </div>
        <div class="dhx_cal_header"></div>
        <div class="dhx_cal_data"></div>
    </div>
</div>

</body>
</html>
Answer posted by Alex (support) on Jan 11, 2010 09:15

Hello,

try to use 

ex[0] = new dhtmlXCombo("exec1", "ex1", "200px"); 

ex[0].enableFilteringMode(true)

ex[0].loadXML("comp.xml");

instead of

ex[0] = new dhtmlXCombo("exec1", "ex1", "200px"); 

ex[0].enableFilteringMode(true, "comp.xml", false, false);