How to hide an option in dhtmlxCombo?

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 ?

Hi

extra comma after last item?
{value: “12”, text: “Test”},

try the following:

DACombo.filter(function(avgOption){ if (userAvg.indexOf(parseInt(avgOption.value)) == -1) { return false; // hide } else { return true; // keep visible } });

Brilliant,
thanks