add a Horizontal Scrollbar in a comboBox for the long text dropdown items

Question

I have tried using dropdownWidth property, however it will be static. But if data is too long again i can't see the full text in the dropdown.

So my requirement is to set the width based on the long width of the text of the dropdown item either to set the horizontal scroll bar .

Since the flex does not support the horizontal scrolling , i override the Combobox class

<mx:FormItem id="zoneformitem" label="{Localizer.getString('zone','i18n')}" paddingLeft="60" paddingTop="15" required="true">
<mx:ComboBox id="selectedzone" open="campaigns.view.utils.CustomiZeCombo"
selectedIndex="-1" 
dropdownWidth="210" width="209" change="validateZoneSelection()" 
focusOut="validateZoneSelection()"
 dataProvider="{slotProxy.slotWizardVo.currentZones.source.
sortOn('zoneName')}" >
<mx:itemRenderer>
<mx:Component>


    public class CustomiZeCombo extends ComboBox{
    public function CustomiZeCombo(){
        super();
    }
    override public function open():void { 
        dropdown.horizontalScrollPolicy = ScrollPolicy.ON; 
        super.open(); 
    } 

override protected function 
       downArrowButton_buttonDownHandler(event:FlexEvent):void { 
        dropdown.horizontalScrollPolicy = ScrollPolicy.ON; 
        super.downArrowButton_buttonDownHandler(event); 
        } 
    }

But i am not getting how to call that event to make it work. Suggestions are greatly appreciated.

Answer 1

Try calling the below method using click() even of Combobox.

 private function setWidthForLongdata():void {
        var width:int;
        width = selectedzone.width;
        var maxWidth:int;
        maxWidth = width + (width/2);

        for each (var zone:ZoneVO in slotProxy.slotWizardVo.currentZones.source) {
        if(zone.zoneName.length > maxLen ) {
        maxLen = zone.zoneName.length;
        }
        }

        if(maxLen*13 > width) {
        width = maxLen*13;

        if(width>maxWidth) {
        width = maxWidth;
        }
        }
        selectedzone.dropdown.width=width;
        }