Combo inside Gantt lightbox

I use code from your example (04_ondynxls_usage.html) to load combo inside gantt lightbox and just can’t get combo box to display items after typing first letter in combo input field. Here is my code:

gantt.form_blocks["autocomplete"] = { render: function (sns) { return "<div class='combo_info'>start type: the adventures...</div><div id='combo_zone' style='width:230px; height:30px;'></div>"; }, set_value: function (node, value, task) { var myCombo; myCombo = new dhtmlXCombo("combo_zone", "combo", 230); myCombo.enableFilteringMode(true, "custom"); myCombo.attachEvent("onDynXLS", function (text, ind) { if (text.replace(/^\s{1,}/, "").replace(/\s{1,}$/, "").length == 0) { myCombo.closeAll(); myCombo.clearAll(); } else { myCombo.clearAll(); myCombo.load('{options:[' + '{value: "77942", text: "Airport Copenhagen"},' + '{value: "77943", text: "Airport Dublin"},' + '{value: "88944", text: "Airport Frankfurt"}' + ']}'); myCombo.openSelect(); } }); }, get_value: function (node, task) { }, focus: function (node) { } };

Please help.

please provide a complete demo (with configs of gantt and all related js/css). You can create it here and then save sample by pressing ‘Share’ button

1 Like

Actually I am receiving error when I include dhtmlx.js in snippet.

Sorry, now it’s working. And you can see what is the problem… just start typing “Air” into combobox.

I found what is the problem. Problem is in combo list DOM element position which is outside of lightbox popup and also left and top position of combo list element is wrong.

I made a quick and dirty fix that correct those things with jquery in onOpen event of combo but that is more like hacking.

you need to add dhtmlx.css for correct styles of combo box dropdown. There is also seems to be a conflict between z-indexes of dropdown and gantt lightbox, please see the working demo

Thank you very much, it’s working.