Flex checkbox control example

The page provides illustration about the working of flex checkbox control. Example is based on registration for online training courses. On the registration form, trainee check marks the courses in which he/she is interested. After that it clicks on Post button to send its request. For check marking flex check boxes are created and for posting flex button control is used. Functionalities like getting marked courses data and processing it, is achieved via two void functions Course_selected and Request_Process, created in the example.

Flex check boxes controls possess a box and a label. On the box, check marks are marked and with label, information regarding the check box control is demonstrated.

Syntax for creating CheckBox control :
<mx:CheckBox/>

Onlineline_Training.mxml


<?xml version = '1.0' encoding = 'ISO-8859-1'?>

<mx:Application 

  xmlns:mx = 'http://www.adobe.com/2006/mxml'

  backgroundColor = '0x000000'

  backgroundGradientColors = '[#330033, #660000]'

>



  <mx:Script>

  import mx.controls.*;



  <!-- method adds text to TextArea control -->  

  public function Course_Selected():void{

  txt.text = '';  

  

  if(Java.selected)

  txt.text += 'Java' + '\n';

  if(Advanced_Java.selected)

  txt.text += 'Advanced Java Training' + '\n';

  if(Mysql.selected)

  txt.text += 'Mysql Training' + '\n';

  if(JSP.selected)

  txt.text += 'JSP Training' + '\n';

  if(Hibernate.selected)

  txt.text += 'Hibernate Training' + '\n';

  if(Servlet.selected)

  txt.text += 'Servlet Training' + '\n';

  }

  

  

  <!-- function process the user checks result --> 

  public function Request_Process():void{

  if(txt.text == '')

  Alert.show('Request rejected' 

  + '\n' + 'no course selected');

  else

  Alert.show('Request send' + '\n' 

  + 'soon u will get a call from company');

  }

  

  </mx:Script>

  

  <mx:Panel 

  title = 'Roseindia Online Training Service'

  width = '50%' height = '60%'

  paddingBottom = '10' paddingTop = '10' 

  paddingLeft = '10' paddingRight = '10' 

  color= '#CCCCCC' 

  borderAlpha='0.20'

  >

  <mx:HBox>

  <mx:VBox color = '#330033'>

  <mx:CheckBox 

  id = 'Java'

  label = 'Core Java Training'

  click = 'Course_Selected()'

  iconColor= '#66FF33'/>

  <mx:CheckBox

  id = 'Advanced_Java'

  label = 'Advanced Java Training'

  click = 'Course_Selected()'

  iconColor = '#3300FF'/>

  <mx:CheckBox

  id = 'Mysql'

  label = 'Mysql Training'

  click = 'Course_Selected()'

  iconColor = '#660000'/>

  <mx:CheckBox

  id = 'JSP'

  label = 'JSP Training'

  click = 'Course_Selected()'

  iconColor = '#336600'/>

  <mx:CheckBox

  id = 'Hibernate'

  label = 'Hibernate Training'

  click = 'Course_Selected()'

  iconColor = '#33CC66'/>

  <mx:CheckBox

  id = 'Servlet'

  label = 'Servlet Training'

  click = 'Course_Selected()'

  iconColor = '#330000'/>

  </mx:VBox>

  

  <mx:VBox width = '100%' height = '100%'>

  <mx:Label text = 'Shopping items list'/>

  <mx:Button 

  id = 'item_delivery'  

  label = 'Post' 

  click = 'Request_Process()'

  color = '#000000'

  y = '200'

  />

  <mx:TextArea 

  id = 'txt' 

  width = '100%' height = '100%'

  verticalScrollPolicy = 'off' 

  editable = 'false'

  color = '#000033'

  /> 

  </mx:VBox>

  </mx:HBox>

 

  </mx:Panel>



</mx:Application>

Onlineline_Training.swf

Download the code

«Previous Index Next»

Recommend the tutorial

Ask Questions? Discuss: Flex checkbox control example

Post your Comment

Comments

Latest
Related
Frameworks
Category