TabNavigator Problem

Hi I have quite a complex component within my Flex 2
application….
The component consists of numerous tabs within a
tabNavigator… and each tab contains a dataGrid that displays
data from a webService relevant to the selected tab.
This is quite difficult for me to explain in words so I will
apologise in advance if it makes no sense, but I will give it a
go…..
The tabs work fine, and the dataGrids are populated when the
tabs are changed… when a tab is selected, it passes a
variable to the web service which then pulls back and displays in
the dataGrid all relevant data to the sent variable etc….
Each tab within the tabNavigator contains a different /
separate dataGrid with a unique name / ID!
The problem that I am having is when you change the tabs
quickly, its as if the web service cant keep up and is getting
confused as to what data to display in what dataGrid
etc……. although if you move through more slowly it
works perfectly.
I thought that maybe a “quick fix” to this is
maybe to disable elements / tabs within the component until the web
service has completed loading therefore not allowing the user to
change tabs (as they are disabled) until the dataGrid has been
loaded etc….. but I don’t know how to do this :(
Does anyone know how I can go about doing this, or if there
is another solution to my problem? - Any suggestions?
Thanks,
Jon.

Hi Biebel37,
I was able to get a runtime error with a test app I wrote
doing something similar to what you described. I think what you're
doing should be legal, so it may be an SDK bug, but I'll file it
and see if the SDK team agrees :)
One workaround that might work for you would be to make it so
that instead of creating the TabNavigator in a given state (using
AddChild), you put it in the base state, but set visible="false".
Then, in the state where you want it to appear, use <SetProperty
target="{nav}" name="visible" value="true"/>. (Depending on how
you're doing your layout, you may need to set
includeInLayout="false" in the base state and set it to true in the
other state as well.) In my test app, this avoids the runtime
error.
Thanks,
nj
Flex Builder team

Similar Messages

Tabnavigator problems

Hi all, I have a Tabnavigator with 5 tabs, each of which has charts of one sort or another. Since migrating to FB4 I get a problem where if the contents of one tab change, suddenly the content of all of them is displayed at the same time which looks absolutely awful. By clicking on each of the tabs the problem is gradually removed. I saw someone else reported this problem on stackoverflow.com:
http://stackoverflow.com/questions/4638300/tabnavigator-tab-content-retains-strangely-flas hbuilder-4

Just started getting this problem again with Flash 11.2. I have this in Firefox (debug version) :
Version: 11.2.202.228
and this in IE8: (not debug version)
11.2.202.233
Has anybody got any ideas on how to resolve it?

Tabnavigator with swfloader problem

Hello,
I'm trying to run a tabnavigator component with each tab having a separate swfloader. Each swfloader is a different datagrid that I populate with the SystemManager.application['functionName'] = 'parameters' method.
My problem is that when I a few tabs, only the very last tab's datagrid will have data, and the others will be blank. What's wrong with it?
            public var matrixLoader:SWFLoader;
            public function addTab(tabName:String, swfURL:String, setFunc:Array, searchString:Array):void {
                var tabCanvas:Canvas = new Canvas();
                tabCanvas.label = tabName;
                tabCanvas.id = tabCanvas.label;
                tabCanvas.horizontalScrollPolicy = "off";
                tabCanvas.verticalScrollPolicy = "off";
                functionName = new Array(setFunc);
                paramString = new Array(searchString);
                matrixLoader = new SWFLoader();
                matrixLoader.minHeight = 100;
                matrixLoader.minWidth = 100;
                matrixLoader.percentWidth = 100;
                matrixLoader.percentHeight = 100;
                matrixLoader.addEventListener(FlexEvent.UPDATE_COMPLETE, created);
                matrixLoader.load(swfURL);
                tabCanvas.addChild(matrixLoader);
                tabnavi.addChildAt(tabCanvas,tabnavi.numChildren);
            public var loadedSM:SystemManager;
            private function created(event:FlexEvent):void {
                loadedSM = new SystemManager();
                if (matrixLoader.content != null) {
                    loadedSM = SystemManager(matrixLoader.content);
                    if (loadedSM.application != null) {
                        for(var i:int = 0; i < functionName.length; i++){
                            loadedSM.application[functionName[i].toString()] = paramString[i].toString();
Any help would be greatly appreciated.

Hopefully before you maybe loaded the subapp via
    swfLoader1.source="subapp.swf?foo=1
    swfLoader2.source="subapp.swf?foo=2
And code somewhere in the Application checked parameters.foo and set foo
appropriately:
    <mx:Application initialize="checkFoo()"...
    <mx:Script>
        public var foo:int;
        private function checkFoo():void
            foo = parameters.foo;
Now you just load the module once w/o parameters
    private var modInfo:IModuleInfo = ModuleManager.getModule("module.swf");
And once the module is ready:
    var module1:IMyModuleInterface = modInfo.factory.create();
    module1.foo = 1;
And
    var module2:IMyModuleInterface = modInfo.factory.create();
    module2.foo = 2;

TabNavigator Child Control Problem on Programmatic SelectedIndex Change

I've got a TabNavigator that contains another TabNavigator as
a child control on its second page. On the child TabNavigator
there's a ViewStack and a couple of Accordion controls. On my first
parent tab I've got a Button that, when clicked, programmatically
changes the selectedIndex of the parent TabNavigator to display the
contents of the second tab (which contains the child TabNavigator).
I'm finding that when the index of the TabNavigator is
changed programmatically, all of the controls in the child
TabNavigator are stacked on top of each other and overlapping as
though the Flash player has no clue how to display these child
controls. Once I click through each tab on the child TabNavigator,
they appear intact. If I click the Button to change the tab again,
all of the controls will be jumbled and stacked.
This problem happens 100% of the time. I've changed every
single control in my app to creationPolicy="all" to no avail.
Anybody experienced this or know what to do?

I've got a TabNavigator that contains another TabNavigator as
a child control on its second page. On the child TabNavigator
there's a ViewStack and a couple of Accordion controls. On my first
parent tab I've got a Button that, when clicked, programmatically
changes the selectedIndex of the parent TabNavigator to display the
contents of the second tab (which contains the child TabNavigator).
I'm finding that when the index of the TabNavigator is
changed programmatically, all of the controls in the child
TabNavigator are stacked on top of each other and overlapping as
though the Flash player has no clue how to display these child
controls. Once I click through each tab on the child TabNavigator,
they appear intact. If I click the Button to change the tab again,
all of the controls will be jumbled and stacked.
This problem happens 100% of the time. I've changed every
single control in my app to creationPolicy="all" to no avail.
Anybody experienced this or know what to do?

TabNavigator's tab dynamic visibility handling problem.

Hello All,
I am facing problem in TabNavigator component.
My application has one tabnavigator with 4 tabs. (T1,T2,T3,T4)
Tabs visibility is depend on data which are load in those tabs.
If data is getting Null from database for T2, T2 tab will not displayed. Only other 3 are displayed.
I have tried this....
myTabNavigator.getTabAt(myTabNavigator.getChildIndex(myT2tab)).visible = false;
myTabNavigator.getTabAt(myTabNavigator.getChildIndex(myT2tab)).includeInLayout = false;
but problem is if once tab is hide by above code, will not visible again by setting visibile & includeInLayout property to true.
Anyone else noticed this, have any suggestions?
Thank you.

Hi Tejas S Patel,
I dont see any such kind of problem...I have run a test...it works perfectly fine.
Below is the sample test I have done..
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<mx:TabNavigator width="103" id="tabone">
<mx:Canvas label="First Canvas" width="100%" height="100%">
   <mx:Label text="First Canvas"/>
</mx:Canvas>
<mx:Canvas label="Second Canvas" width="100%" height="100%">
   <mx:Label text="Second Canvas"/>
</mx:Canvas>
<mx:Canvas label="Third Canvas" width="100%" height="100%">
   <mx:Label text="Third Canvas"/>
</mx:Canvas>
</mx:TabNavigator>
<mx:HBox top="100">
<mx:Button id="btn1" label="HIDE SECOND TAB" click="tabone.getTabAt(1).visible=false;tabone.getTabAt(1).includeInLayout=false;"/>
<mx:Button id="btn2" label="SHOW SECOND TAB" click="tabone.getTabAt(1).visible=true;tabone.getTabAt(1).includeInLayout=true;"/>
</mx:HBox>
</mx:Application>
Thanks,
Bhasker Chari

TabNavigator.selectedIndex problem

What I'm trying to do, is some data validation before allowing a user to change tabs, so I put some code in the change handler on the tabNavigator, which fires when a user clicks another tab. If the validation fails, then the code sets the selectedIndex back to the index of the previous tab.
This all works fine, but for some reason, the tab which was clicked on becomes a "dead" tab, and no longer fires a change event when clicked on. Anyone know what is happening here, or a way to correct this issue?
I've tried tabNavigator.validateNow(), but that didn't seem to do much.
Many thanks!

Thanks for your input David. Basically, the client wants the app to check to make sure a user has entered certain data before allowing them to leave the current tab. The action the user takes, will be clicking on another tab, so the change event seems like the only place I can capture this action and alert the user they need to do something.
Here is an example of what the code looks like:
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
     <mx:Script>
          <![CDATA[
          import mx.events.FlexEvent;
          import mx.events.IndexChangedEvent;
          protected function handleTnChange(e:Event):void
               var failed:Boolean = true;
               //Assume validation failed for test
               if (failed) {
                    tn.selectedIndex = _tnSelectedIndex; //tnSelectedIndex holds the previous selected tab index before the user click
               else{
                    //Proceed to the selected tab
     ]]>
     </mx:Script>
     <mx:TabNavigator id="tn" change="handleTnChange(event)">
          <mx:Canvas label="Tab 1" width="100%" height="100%">
          </mx:Canvas>
          <mx:Canvas label="Tab 2" width="100%" height="100%">
          </mx:Canvas>
          <mx:Canvas label="Tab 3" width="100%" height="100%">
          </mx:Canvas>
     </mx:TabNavigator>
</mx:Application>
So, assuming the user is on Tab 1, and clicks Tab 2, what is happening is the selectedIndex gets changed back to Tab 1 in the change function, but Tab 2 seems to become "dead", so that when the user clicks on Tab 2 again, it doesn't fire a change event.
Something I noticed while trying to figure out the problem, is that on the mouse down event when clicking a tab, the change fires, and the tab changes, but on the mouse up, the tabNavigator seems to come back, at least the tab itself, to the tab that was originally clicked before the selectedIndex was changed.
Anyway, hope this clears up what I'm trying to do.
Thanks!

Problem with tabnavigator index change effect

Hello All,
I am using
<?xml version="1.0" encoding="utf-8"?>
<mx:Application
xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" verticalAlign="middle" horizontalAlign="center">
<mx:TabNavigator id="tabNav" height="600" width="600" change="onTabChange(event)">
<mx:VBox horizontalAlign="center" verticalAlign="middle" height="100%" width="100%" label="Tab 1">
<mx:Label text="Tab 1" fontSize="30" />
</mx:VBox>
<mx:VBox horizontalAlign="center" verticalAlign="middle" height="100%" width="100%" label="Tab 2">
<mx:Label text="Tab 2" fontSize="30" />
</mx:VBox>
<mx:VBox horizontalAlign="center" verticalAlign="middle" height="100%" width="100%" label="Tab 3">
<mx:Label text="Tab 3" fontSize="30" />
</mx:VBox>
<mx:VBox horizontalAlign="center" verticalAlign="middle" height="100%" width="100%" label="Tab 4">
<mx:Label text="Tab 4" fontSize="30" />
</mx:VBox>
</mx:TabNavigator>
<mx:Script>
<![CDATA[
import mx.effects.Move;
import mx.events.IndexChangedEvent;
import mx.events.EffectEvent;
public function onTabChange(event:IndexChangedEvent):void
var oldTab:DisplayObject = tabNav.getChildAt(event.oldIndex);
var newTab:DisplayObject = tabNav.getChildAt(event.newIndex);
var moveEffect:Move = new Move();
moveEffect.target = oldTab;
var moveEffect2:Move = new Move();
moveEffect2.target = newTab;
if(event.oldIndex > event.newIndex)
//Moving old Tab out to the right, new tab in from the left
oldTab.x = 0;
moveEffect.xTo = oldTab.width + 100;
moveEffect.yFrom = oldTab.y;
moveEffect.yTo = oldTab.y;
newTab.x = -oldTab.width;
moveEffect2.xTo = 0;
moveEffect2.yFrom = oldTab.y;
moveEffect2.yTo = oldTab.y;
else
//Moving old Tab out to the left, new tab in from the right
oldTab.x = 0;
moveEffect.xTo = -oldTab.width;
moveEffect.yFrom = oldTab.y;
moveEffect.yTo = oldTab.y;
newTab.x = oldTab.width + 100;
moveEffect2.xTo = 0;
moveEffect2.yFrom = oldTab.y;
moveEffect2.yTo = oldTab.y;
oldTab.visible = true;
newTab.visible = true;
moveEffect2.play();
moveEffect.addEventListener(EffectEvent.EFFECT_END,tabOffScreen);
moveEffect.play();
private function tabOffScreen(event:EffectEvent):void
event.target.removeEventListener(EffectEvent.EFFECT_END,tabOffScreen);
event.target.target.visible = false;
]]>
</mx:Script></mx:Application>
to run the slide effect in flash builder 4.5 with sdk 4.5. When the effect plays, the selected child behaves abnormal whereas when it runs with sdk 3.6 in flash builder 4.5, everything goes well.
Any help will be apppreciated.
-Thanks and regards
Vishal Kumar

Hi Biebel37,
I was able to get a runtime error with a test app I wrote
doing something similar to what you described. I think what you're
doing should be legal, so it may be an SDK bug, but I'll file it
and see if the SDK team agrees :)
One workaround that might work for you would be to make it so
that instead of creating the TabNavigator in a given state (using
AddChild), you put it in the base state, but set visible="false".
Then, in the state where you want it to appear, use <SetProperty
target="{nav}" name="visible" value="true"/>. (Depending on how
you're doing your layout, you may need to set
includeInLayout="false" in the base state and set it to true in the
other state as well.) In my test app, this avoids the runtime
error.
Thanks,
nj
Flex Builder team

TabNavigator repeats backgroundImage problem

I am trying to use a background image in my TabbedNavigator.
The image appears successfully where it should,
EXCEPT a small part of it is also repeated behind the tabs.
I have tried several images of varying sizes, and this occurs every
time.
Is this normal behavoir? Is there a way to avoid this? My
code is:
<mx:TabNavigator styleName="tabnav"
backgroundImage="{EmbeddedAssets.BG}" width="805" height="580"
top="10" left="10">
where EmbeddedAssets is an AS class containing static
references to embedded image files.
Thanks

quote:
Originally posted by:
John Hall
But if it's always at the same level of a container inside a
tab, could you refer to the parent and get the selectedIndex before
you leave and reset it to that selectedIndex
Tab Navigator has a few events. For mentioned above you have
to use 2 events:
1. change - here you have to capture 2 values; oldIndex and
id. you can't cancel action here because at this moment you don't
know about validation error.
2. updateComplete - here you are on new tab and don't have
info about oldIndex. You have to use captured on first stage info.
Now you knowabout validator status and can return back to oldIndex.
There are a lot of additional variables and code involved
into this process.
It is really painful to track everything due to TabNavigator
bug which should fire "Focus out" event for validated object and
cancel moving to new tab if there was validation error.

Problem in tabnavigator?

Hi,
I have downloaded code for tabnavigator maximize and restore from the net.I have attatched as file.Just download
and import in ur flex builder.From output u will find tabnavigator maximize,restore and above tabnavigater down arrow
will be present in top right corner.I have to remove that down arrow,but unable to do that.Here that entire component
has build based on swc file.How to remove that arrow?Plz help me.I have to use this one in my application or If u
have any code for tab navigator maximize or restore plz send me.
Regards
D.Mahesh Babu

Set popUpButtonPolicy to off,
<code:SuperTabNavigator
          id="mySuperTabNavigator"
          height="50%" width="100%"
          bottom="5" right="5" left="5"
          closePolicy="close_selected"
          popUpButtonPolicy="off"
          tabClose="maxClick(event)">
     <mx:VBox label="Tab 1"/>
     <mx:VBox label="Tab 2"/>
     <mx:VBox label="Tab 3"/>
</code:SuperTabNavigator>

TabNavigator Label shows problem in chrome

SDK: flexsdk3.5
Browser: chrome Version 26.0.1410.43 m
Flash: flash player Version 11,6,602,180
when i set tab sytle (fontFamily: Arial;fontSize: 12px;), then set '→' to the label , it shows good in ie and firefox, but not in chrome
here is the code:
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Style>
TabNavigator {
   tabStyleName: "myTabs";
.myTabs {
   fontFamily: Arial;
   fontSize: 12px;
</mx:Style>
<mx:TabNavigator id="tn" width="100%" height="100%">

<mx:VBox label="Panel1→Panel2">
   <mx:Label text="TabNavigator container panel 1"/>
</mx:VBox>
<mx:VBox label="Panel 2">
   <mx:Label text="TabNavigator container panel 2"/>
</mx:VBox>
</mx:TabNavigator>
</mx:Application>
the screenshot:
when i set fontSize to 11, then it is right.
How to solve this. Thank you for any helps.
Best regards. Huang

today, i test again, find it is button not work
the code:
Text, Button {
   fontFamily: Arial;
   fontSize: 12;
<mx:Button label="Panel1→Panel2"/>
<mx:Text text="Panel1→Panel2"/>
the result is the text shows right, button shows wrong.
can anybody knows how to solve this, Thasks a lot.
Best regard.

How can I initialize all TabNavigator Tabs upon a state change?

Here's the basic goal. I want to provide two views to the
user that display the same panels. I configured each view as a
separate state but I am having trouble initializing each of the tab
views since they are only created by Flex when the user first
selects it. I need them all created when the user changes to that
state so that I can insert my view objects. Does that make sense?
Ok, how about an example program. I define three view objects
in ActionScript which will be used in two different states. I use
AddChild to put them in the proper layout location. The problem is
with the Tab state. The AddChild operation only works for the first
tab because it is visible. The other two tabs don't get setup
properly. Can anyone help me resolve this?
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="
http://www.adobe.com/2006/mxml"
layout="vertical"
creationComplete="onCreationComplete()">
<mx:Script>
<![CDATA[
import mx.containers.VBox;
import mx.controls.Label;
[Bindable] public var view1:VBox;
[Bindable] public var view2:VBox;
[Bindable] public var view3:VBox;
private function onCreationComplete():void
var label1:Label = new Label();
var label2:Label = new Label();
var label3:Label = new Label();
label1.text = "This is view 1.";
label2.text = "This is view 2.";
label3.text = "This is view 3.";
view1 = new VBox();
view1.label = "View 1";
view1.addChild(label1);
view2 = new VBox();
view2.label = "View 2";
view2.addChild(label2);
view3 = new VBox();
view3.label = "View 3";
view3.addChild(label3);
currentState = "wizardState";
private function changeState():void
switch(stateBox.selectedItem.data)
case 0: currentState = 'wizardState'; break;
case 1: currentState = 'tabState'; break;
]]>
</mx:Script>
<mx:Panel id="mainPanel" title="Tab View Bug" width="400"
height="320"/>
<mx:ComboBox id="stateBox" change="changeState()">
<mx:dataProvider>
<mx:Object label="Wizard" data="0"/>
<mx:Object label="Tabbed" data="1"/>
</mx:dataProvider>
</mx:ComboBox>
<mx:states>
<mx:State name="wizardState">
<mx:AddChild relativeTo="{mainPanel}"
position="lastChild">
<mx:HBox width="100%" height="100%"
verticalAlign="top">
<mx:ToggleButtonBar id="wizardButtonBar" width="20%"
direction="vertical"
dataProvider="{wizardViewStack}"/>
<mx:ViewStack id="wizardViewStack" width="80%"
selectedIndex="{wizardButtonBar.selectedIndex}"/>
</mx:HBox>
</mx:AddChild>
<mx:AddChild target="{view1}"
relativeTo="{wizardViewStack}" position="lastChild"/>
<mx:AddChild target="{view2}"
relativeTo="{wizardViewStack}" position="lastChild"/>
<mx:AddChild target="{view3}"
relativeTo="{wizardViewStack}" position="lastChild"/>
</mx:State>
<mx:State name="tabState">
<mx:AddChild relativeTo="{mainPanel}"
position="lastChild">
<mx:TabNavigator id="tabViewStack" width="100%"
height="100%">
<mx:VBox label="Tab 1" id="tab1"/>
<mx:VBox label="Tab 2" id="tab2"/>
<mx:VBox label="Tab 3" id="tab3"/>
</mx:TabNavigator>
</mx:AddChild>
<mx:AddChild target="{view1}" relativeTo="{tab1}"
position="lastChild"/>
<mx:AddChild target="{view2}" relativeTo="{tab2}"
position="lastChild"/>
<mx:AddChild target="{view3}" relativeTo="{tab3}"
position="lastChild"/>
</mx:State>
</mx:states>
</mx:Application>

Ok, here is an even simpler scenario. I take each view from
the default state and put them in the new tab view when the state
changes. If you compile and run this example, the only view that
makes it into the tabview is the one that was active when the state
changed. Why is that?
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="
http://www.adobe.com/2006/mxml"
layout="vertical">
<mx:Script>
<![CDATA[
private function changeState():void
switch(stateBox.selectedItem.data)
case 0: currentState = ''; break;
case 1: currentState = 'tabState'; break;
]]>
</mx:Script>
<mx:Panel id="mainPanel" title="Tab View Bug" width="400"
height="320">
<mx:HBox id="wizardView" width="100%" height="100%"
verticalAlign="top">
<mx:ToggleButtonBar id="wizardButtonBar" width="20%"
direction="vertical"
dataProvider="{wizardViewStack}"/>
<mx:ViewStack id="wizardViewStack" width="80%"
selectedIndex="{wizardButtonBar.selectedIndex}"
creationPolicy="all">
<mx:Canvas id="view1" label="Part 1" >
<mx:TextInput text="This is view 1"/>
</mx:Canvas>
<mx:Canvas id="view2" label="Part 2">
<mx:TextInput text="This is view 2"/>
</mx:Canvas>
<mx:Canvas id="view3" label="Part 3">
<mx:TextInput text="This is view 3"/>
</mx:Canvas>
</mx:ViewStack>
</mx:HBox>
</mx:Panel>
<mx:ComboBox id="stateBox" change="changeState()">
<mx:dataProvider>
<mx:Object label="Wizard" data="0"/>
<mx:Object label="Tabbed" data="1"/>
</mx:dataProvider>
</mx:ComboBox>
<mx:states>
<mx:State name="tabState">
<mx:AddChild relativeTo="{mainPanel}"
position="lastChild">
<mx:TabNavigator id="tabView" width="100%" height="100%"
creationPolicy="all">
<mx:Canvas label="Tab 1" id="tab1"/>
<mx:Canvas label="Tab 2" id="tab2"/>
<mx:Canvas label="Tab 3" id="tab3"/>
</mx:TabNavigator>
</mx:AddChild>
<mx:RemoveChild target="{view1}"/>
<mx:AddChild target="{view1}" relativeTo="{tab1}"/>
<mx:RemoveChild target="{view2}"/>
<mx:AddChild target="{view2}" relativeTo="{tab2}"/>
<mx:RemoveChild target="{view3}"/>
<mx:AddChild target="{view3}" relativeTo="{tab3}"/>
<mx:RemoveChild target="{wizardView}"/>
</mx:State>
</mx:states>
</mx:Application>

How to access a function in a tabnavigator container?

I have a tabNavigator container that I create the tabs using
the following code:
var tabFieldsBase1:Canvas = new Canvas();
var _userFields:userFields = new userFields;
tabFieldsBase1.label = "User Fields";
_userFields.id = "userFields";
tabFieldsBase1.addChild(_userFields);
tabHolder.addChild(tabFieldsBase1);
inside the tabed document/class I have a function/method
named: startMeUp(). How can I call this function in the currently
active tabed class using AS3 in my app?
I've tried many ways including: var testTemp:Object =
tabHolder.selectedChild.getChildAt(0);
testTemp.startMeUp();
userFields.startMeUp();
Thanks for the help;
Carlos

Thanks Tracy for your input, I think my problem is
understanding Flex 2 scopes properly.
I'm under the impression that when you create an mxml file
compoenent that Flex 2 converts that into an AS2 class, but I guess
not.
I solved this situation by using Actionscript 3 classes to
build my tabs. Now when my main form changes I'm able to
automatically synchronize the displayed tab by calling a method in
the class.
Thanks!!
Carlos

How do I have a tabnavigator page specific cfsavecontent?

How do I write this so that a button on a tabnavigator page
calls javascript function
that will pass the correct identifier for the page?
Any ideas?
<script language='JavaScript'>
<cfoutput>
function GotoPage(ID)
var sLocation;
sLocation = "gotoPage.cfm?ID=" + ID;
parent.location = sLocation;
</cfoutput>
</script>
</head>
<body >
<h1>Information</h1>
<cfoutput>
<cfform name='form_Info' format="flash" method="POST"
width="90%" height="500" skin="haloBlue" action="NextPage.cfm">
<cfformgroup type="hbox" label="Client">
<cfformitem type="html">
<cfinput type="text" id="ClientName" name="ClientName"
value="John Smith, Inc." size="60" label="Name: "/>
</cfformitem>
</cfformgroup>
<cfformgroup type="tabnavigator">
<cfformgroup type="page" label="John Smith">
<cfformitem type="html">
<cfinput type="text" id="EmployeeName"
name="EmployeeName" value="John Smith" size="60" label="Name:
"/>
</cfformitem>
<cfinvoke
component="PhoneNumbers"
method="List"
returnvariable="rsContactInfo"
>
<cfformgroup type="tabnavigator" id="tabContactInfo">
<cfloop query="rsContactInfo">
<cfformgroup type="page" label="#rsContactInfo.type#">
<cfformitem type="html">
<cfinput type="text"
id="ContactInfoPhone_#rsContactInfo.id#"
name="ContactInfoPhone_#rsContactInfo.id#" size="20" maxlength="14"
mask="(999) 999-9999" validate="telephone"
validateAt="onBlur,onSubmit" message="Error in Phone
entry.\nFormat: (999)999-9999" value="#rsContactInfo.phone#"
label="Phone: "/>
</cfformitem>

<cfsaveContent variable="gotoPagejs">

getURL("javascript:GotoPage(#rsContactInfo.id#);");
</cfsavecontent>
<cfinput name="Order" type="button" value="Create Book
Order" onClick="#gotoPagejs#">
</cfformgroup>
</cfloop>
</cfformgroup>
</cfformgroup>
</cfformgroup>
<cfinput name="Save" type="submit" value="Save
Changes">
</cfform>
</cfoutput>
</body>
</html>

Reset the page zoom on pages that cause problems: <b>View > Zoom > Reset</b> (Ctrl+0 (zero); Cmd+0 on Mac)
* http://kb.mozillazine.org/Zoom_text_of_web_pages
You can use one of these extensions to adjust the default font size and page zoom on web pages:
* Default FullZoom Level - https://addons.mozilla.org/firefox/addon/6965
* NoSquint - https://addons.mozilla.org/firefox/addon/2592

Error in app with TabNavigator loaded with SWFLoader - WebKit browsers

Hiya,
I use a flex app (A) to load another flex app (B) using SWFLoader (both built using Flex Builder 3 sometime ago).
Everything works fine as expected across all (IE, FF, Chrome, Safari) desktop browsers.
However, if I use a TabNavigator within the flex app (B) then when you click on any of the tabs it unloads the flex app (B) and re-starts flex app (A). This behaviour is limited to Webkit based browsers (Chrome & Safari) the rest of the browsers (IE, FF) it works fine.
I wonder if anyone can throw some light on this.
Many thanks
Kind regards,
klem

Resolved:
Replacing the HTML template files with the latest copy from Flash Builder 4.5 seemed to resolve the issue. It appears they have replaced the AC_OETags.js with swfobject.js
Tried to explore upgrading the code to 4.5 but seemed to throw a lot of incompatibilities, created a test/dummy project instead in 4.5 and used the html file created to replace the old html files created by Flex Builder 3.0
Clearly not a very common problem, but hope this saves someone time and effort.
Thanks Harui

Tabnavigator validates when switching pages??

I would like to build a cfform with a tabnavigator and two pages. Each page contains fields with some validation rules. I find that when the user switches pages, any integer, range, or other numeric validation rules are fired immediately. Simple isrequired style rules are not.
It is most annoying, since it looks to the user like there are errors before he has even had a chance to enter data.
<cfform name="myform" height="400" width="400" format="Flash" timeout="600">
<cfformgroup type="tabnavigator" id="tabBar">
<cfformgroup type="page" label="Page 1">
   <cfinput type="text" name="Name" label="Name"
    required="Yes" message="Please enter a name.">
</cfformgroup>
<cfformgroup type="page" label="Page 2">
   <cfinput type="text" name="age" label="Age" value="0"
    validate="range" range="1,1000000" message="This value must be greater than 0.">
</cfformgroup>
</cfformgroup>
</cfform>

Chris,
The DB is Oracle 10g, OS is Windows 2003 Server, The Web Server is in the same machine. The server is Dell 1420 SC Xeon @ 2.8GHx, 512MB RAM. It has not much traffic since we are on the development phase, so i don't think it is a capacity problem.
The problem happens when connecting from the internet as well as from the intranet.
I have not seen the Apache access logs, I will see them and update the thread.
Thanks.
Francisco.

TabNavigator Problem

Similar Messages

Maybe you are looking for