Expand-Collapse on label click

hi guys

I am trying to impliment a expand-collapse on a label. When label (inside HBox) is clicked, i want the HBox to expand-collapse.

<mx:VBox width="96%" styleName="responseBox">

<mx:HBox id="outerHbox1" width="100%" maxHeight="261">  
<mx:Label text="Question 25:  Components and Servicess:" creationComplete="expcollLabel(event)" />       
</mx:HBox>

<mx:HBox styleName="projAnswerBox"  width="100%">
<mx:DataGrid id="dataGrid" width="862">
<mx:columns>
<mx:DataGridColumn headerText="List the name of project" />
<mx:DataGridColumn headerText="Modification" />
<mx:DataGridColumn headerText="Company benefits"  />                   
</mx:columns>
</mx:DataGrid>
</mx:HBox>      
            
</mx:VBox>

private function expcollLabel(event:Event):void {                        
var label:Label = event.currentTarget as Label;
var titleBar:UIComponent = rte.mx_internal::getTitleTextField();  --getting error here. ::getTitleBar not found on mx.controls.Label
titleBar.addEventListener(MouseEvent.CLICK, expandCollapseLabel);
expandCollapseLabel(event);
}

private function expandCollapseLabel(event:Event):void{
var label:Label;
if(event.currentTarget is Label){
label = event.currentTarget as Label;
}else{
label = event.currentTarget.parent as Label;
}
var headerHeight:uint = rte.mx_internal::getHeaderHeightProxy();
rte.height = (rte.height == headerHeight ? rte.maxHeight : headerHeight);
}      


Am i doing this correctly?
Any help will be appreciated.

thanks.
royjaydAsked:
Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

x
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

dgofmanCommented:
I think I wrote this code, but you replaced

var titleBar:UIComponent = rte.mx_internal::getTitleBar();
to
var titleBar:UIComponent = rte.mx_internal::getTitleTextField();

<fx:Script>
		<![CDATA[
			import mx.core.UIComponent;

			private function expcollLabel(event:Event):void {
				var label:Label = event.currentTarget as Label;
				var titleBar:UIComponent = rte.mx_internal::getTitleBar(); 
				titleBar.addEventListener(MouseEvent.CLICK, expandCollapseLabel);
				expandCollapseLabel(event);
			}
			
			private function expandCollapseLabel(event:Event):void{
				var label:Label;
				if(event.currentTarget is Label){
					label = event.currentTarget as Label;
				}else{
					label = event.currentTarget.parent as Label;
				}
				var headerHeight:uint = rte.mx_internal::getHeaderHeightProxy();
				rte.height = (rte.height == headerHeight ? rte.maxHeight : headerHeight);
			}
		]]>
	</fx:Script>
	<mx:Panel id="rte" width="100%" height="100%">
		<mx:VBox width="96%" styleName="responseBox">
			
			<mx:HBox id="outerHbox1" width="100%" maxHeight="261">  
				<mx:Label text="Question 25:  Components and Servicess:" creationComplete="expcollLabel(event)" />       
			</mx:HBox>
			
			<mx:HBox styleName="projAnswerBox"  width="100%">
				<mx:DataGrid id="dataGrid" width="862">
					<mx:columns>
						<mx:DataGridColumn headerText="List the name of project" />
						<mx:DataGridColumn headerText="Modification" />
						<mx:DataGridColumn headerText="Company benefits"  />                   
					</mx:columns>
				</mx:DataGrid> 
			</mx:HBox> 
		</mx:VBox>
	</mx:Panel>

Open in new window

0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
dgofmanCommented:
If you want to collapse an aswerBox your code should be like this or you have to change visibility and includeInLayout parameters

<fx:Script>
		<![CDATA[
			private function expandCollapseLabel(event:Event):void{
				answerBox.maxHeight = (answerBox.maxHeight == 0 ? NaN : 0);
			}
		]]>
	</fx:Script>
	<mx:VBox width="96%" styleName="responseBox">
		<mx:HBox id="outerHbox1" width="100%" maxHeight="261">  
			<mx:Label text="Question 25:  Components and Servicess:" click="expandCollapseLabel(event)" />
		</mx:HBox>
		<mx:HBox id="answerBox" styleName="projAnswerBox"  width="100%">
			<mx:DataGrid id="dataGrid" width="862">
				<mx:columns>
					<mx:DataGridColumn headerText="List the name of project" />
					<mx:DataGridColumn headerText="Modification" />
					<mx:DataGridColumn headerText="Company benefits"  />                   
				</mx:columns>
			</mx:DataGrid> 
		</mx:HBox> 
	</mx:VBox>

Open in new window

0
royjaydAuthor Commented:
>>>I think I wrote this code
yep, its your code, i was just playing with it and trying to make it work :)
thanks very much brother, you helped me a lot. I am still learning flex. Let me know if i can help you anyway. I know little java, OOPS and spring.

0
royjaydAuthor Commented:
hi dgofman:

can you please help me with this question when you have time.

http://www.experts-exchange.com/Web_Development/Web_Languages-Standards/Flex/Q_26981918.html#a35484128

thanks in advance
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
Apache Flex

From novice to tech pro — start learning today.