Home Tutorial Flex Flex-components Flex ComboBox controls

 
 

Share on Google+Share on Google+
Flex ComboBox controls
Posted on: April 2, 2010 at 12:00 AM
Advertisement
In this tutorial we can illustrate how to create combo box in flex and What is the process to access the value of combo box in Flex

Flex ComboBox Control:-

The ComboBox control is a Data-Driven control in flex. ComboBox is a drop down list which we can display a list of value and user can select single value. It is similar to HTML select element.

In this tutorial you can see how to create ComboBox in flex and what is the procedure to access the value of Combo Box.

 For Example:-

<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical">

<mx:Script>

<![CDATA[

import mx.events.DropdownEvent;

import mx.controls.Alert;

private function comboboxvalue(event:Event):void{

var combovalve:String = event.currentTarget.selectedIndex;

Alert.show("Combobox Value :"+combovalve);

}

private function openCombo(event:DropdownEvent):void{

//Alert.show("Combo Box is "+event.type);

}

private function closeCombo(event:DropdownEvent):void{

//Alert. show("Combo Box is "+event.type);

}

]]>

</mx:Script>

<mx:Panel width="250" height="200" horizontalAlign="center" verticalAlign="middle" title="Combo Box Panel">

<mx:HBox>

<mx:Text text="Months :"/>

<mx:ComboBox id="cb" width="150" height="25" prompt="-select Months-" change="comboboxvalue(event)" open="openCombo(event)" close="closeCombo(event)">

<mx:ArrayCollection>

<mx:String>January</mx:String>

<mx:String>February</mx:String>

<mx:String>March</mx:String>

<mx:String>April</mx:String>

<mx:String>May</mx:String>

<mx:String>June</mx:String>

<mx:String>July</mx:String>

<mx:String>August</mx:String>

<mx:String>September</mx:String>

<mx:String>October</mx:String>

<mx:String>November</mx:String>

<mx:String>December</mx:String>

</mx:ArrayCollection>

</mx:ComboBox>

</mx:HBox>

</mx:Panel>

</mx:Application>

In this example you can see a combo box which is created by using <mx:ComboBox>tag. ComboBox value are provided through array collection which is display the month name in combo box. And you can see the property prompt is set. which is set when combobox is created. In  this tutorial two event handler are set, one is openCombo<event> and other is closeCombo<event>. The event are pass in both event handler is DropDownEvent.  The third event listener is comboboxvalue<event> which is any type of event, that show how to access the value of combo box in flex. Output of this example is,

Output:-

 Combo box provide scroll Bar if the value of the combo box is greater then the width of the combo box. 

Advertisement

Related Tags for Flex ComboBox controls:


Follow us on Twitter, or add us on Facebook or Google Plus to keep you updated with the recent trends of Java and other open source platforms.

Posted on: April 2, 2010

Recommend the tutorial

Advertisements Advertisements
 

 

 

DMCA.com