?
Solved

dependent drop down list

Posted on 2011-05-02
4
Medium Priority
?
601 Views
Last Modified: 2012-05-11
Hi,
when a user selects a category from the first drop down box then i want the 2nd drop down to be updated based on the selection of the first drop down.  The code below works well but the only problem is that - all the categories are hard coded and i have hundreds of categories in which i cannot manually put all these categories in the code.  So is there a way to automate this without me hard coding all these categories?  thanks
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
			   xmlns:s="library://ns.adobe.com/flex/spark" 
			   xmlns:mx="library://ns.adobe.com/flex/mx"
			   viewSourceURL="srcview/index.html">
	
	<fx:Script>
		<![CDATA[
			import spark.events.IndexChangeEvent;
			import mx.collections.ArrayCollection;
			
			[Bindable]
			public var depts:ArrayCollection = new ArrayCollection([
				{label:"Electronics", data:1}, 
				{label:"Home Goods", data:2},
				{label:"Toys", data:3} ]);
			
			[Bindable]
			public var elecItems:ArrayCollection = new ArrayCollection([
				{label:"Samsung 25in TV", data:299}, 
				{label:"Panasonic Plasma", data:999}, 
				{label:"Sony LCD", data:899} ]);
			
			[Bindable]
			public var homeItems:ArrayCollection = new ArrayCollection([
				{label:"Blendtec Blender", data:399}, 
				{label:"Hoover Vaccuum", data:599}, 
				{label:"Black & Decker Toaster", data:99} ]);
			
			[Bindable]
			public var toyItems:ArrayCollection = new ArrayCollection([
				{label:"Nintendo DS", data:120}, 
				{label:"Lego's Star Wars Set", data:50}, 
				{label:"Leapfrog Leapster", data:30} ]);
			
			private function handleDepartmentSelected(event:IndexChangeEvent):void
			{
				list2.prompt="Select Item";
				list2.selectedIndex=-1; // reset so prompt shows
				if (list1.selectedIndex==0)
					list2.dataProvider=elecItems;
				else if (list1.selectedIndex==1)
					list2.dataProvider=homeItems;
				else if (list1.selectedIndex==2)
					list2.dataProvider=toyItems;
				
			}
			
		]]>
	</fx:Script>
	
	<!-- Note: A custom panel skin is used for the Tour de Flex samples and is included in the
	source tabs for each sample.    -->
	<s:Panel title="DropDownList Sample" 
			 width="100%" height="100%" 
			 skinClass="skins.TDFPanelSkin">
		<s:VGroup width="100%" height="100%" left="120" top="5">
			<s:Label text="RJ's Warehouse Price Checker" fontSize="18" color="0x014f9f"/>
			<s:DropDownList id="list1" width="50%" dataProvider="{depts}" labelField="label" 
							prompt="Select Category"
							change="handleDepartmentSelected(event)"/>
			<s:Label id="text2"/>
			<s:DropDownList id="list2" width="50%" labelField="label" prompt="None"/>
			<mx:Spacer height="10"/>
			<s:Label fontSize="14" color="0x336699" text="The price of item: {list2.selectedItem.label} is: ${list1.selectedItem.data}" verticalAlign="bottom"/>
		</s:VGroup>
	</s:Panel>
	
</s:Application>

Open in new window

0
Comment
Question by:karinos57
  • 2
  • 2
4 Comments
 
LVL 29

Expert Comment

by:Pravin Asar
ID: 35507838
Use the flex remote object calls to fetch the data for second comboBox based on the option selected for first comboBox.




0
 

Author Comment

by:karinos57
ID: 35708493
how you do that?
0
 
LVL 29

Accepted Solution

by:
Pravin Asar earned 1500 total points
ID: 35719438
The serverside mechanics of Remoteobject is dependent on your server language and datasource.

To learn more about how RemoteObject, refer


http://help.adobe.com/en_US/Flex/4.0/AccessingData/WS2db454920e96a9e51e63e3d11c0bf69084-7fda.html

 
0
 

Author Closing Comment

by:karinos57
ID: 35794697
thnx
0

Featured Post

Concerto's Cloud Advisory Services

Want to avoid the missteps to gaining all the benefits of the cloud? Learn more about the different assessment options from our Cloud Advisory team.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Sometimes you know that one object has a specific child in it, but you can't find the child. This happened to me when I was trying to code some actionScript to make a toolbar work with its embedded buttons.  My partner had created the toolbar usi…
While working over numerous projects I often had the requirement for doing a screen capture in AS3.0. Unfortunately I found no "ready made" solutions in google search that suited my requirements. But I did come across some great resources which help…
In this tutorial viewers will learn how to create a basic shape tween animation in Flash including shape hints for smooth animation Open a new document in Flash: Draw a shape: Select another frame (how long you want the tween to be): Right click and…
The goal of the tutorial is to teach the user how to select the video input device. Make sure you have an input device that in connected and work and recognized by Adobe Flash Media Live Encoder and select it in the “video input” menu.
Suggested Courses

571 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question