I have a combo inside a dhtmlx form in a dhtmlxwindow/layout with some options in it.
Lets say the form code is the one below:(created dynamically from php during page load)
DAFormData = [
{type: "settings", labelWidth: 250, offsetLeft: 30},
{type: "combo", name: "DEF_AVG", label:"Set Default Average", readonly:true, options:[
{value: "-187", text: "SABC"},
{value: "12", text: "Test"},
]},
{type: "button", name: "submit", value: "Save Changes", inputLeft:100, inputTop:65, position:"absolute" }
]
dhxFormDA.loadStruct(DAFormData);
When I click on certain links in this page this form/window is displayed. But before its displayed, I need to hide or show these combo options based on the link clicked. (We need to reuse these options so we better not delete it) . I tried to achieve this by the following code:
var DACombo = dhxFormDA.getCombo("DEF_AVG");
DACombo.forEachOption(function(avgOption){
if(userAvg.indexOf(parseInt(avgOption.value)) == -1){
DACombo.updateOption(avgOption.value,avgOption.value,avgOption.text,"visibility:hidden;");
}else{
DACombo.updateOption(avgOption.value,avgOption.value,avgOption.text,"visibility:visible;");
};
});
It hides the Option text but still clicking on it populates the value like a regular option(Please see screenshot):
How do I dynamically hide the options for a dhtmlx combo ?