Need help with navigation within a spark list...

Question

hey guys, so in my application when you click on a list item, it opens up an image, and along with the image a few buttons are created dynamically...
the image and the url/labels for the dynamic buttons is provided through an xml/xmlListCollection.
what i need help with is the url or more specifically when you click on one of these dynamic buttons it needs to navigate me to another part of an list or display a certain set of images that is not in my spark list...
please let me know if this makes no sence
the code i have is
<code>
    [Bindable] private var menuXml:XML;
    [Bindable] private var imgList:XMLListCollection = new XMLListCollection();
    [Bindable] private var navControl:XMLListCollection = new XMLListCollection();
    [Bindable] private var fullList:XMLListCollection = new XMLListCollection();
    private var returnedXml:XMLListCollection = new XMLListCollection();
    private var myXmlSource:XML = new XML();
    //[Bindable] private var xmlReturn:Object;
    private var currImage:int = 0;
    //public var userOpProv:XMLListCollection = new XMLListCollection();
    //private var troubleShootProvider:XMLListCollection = new XMLListCollection();
    private function myXml_resultHandeler(event:ResultEvent):void{
        userOptionProvider.source = event.result.apx32.userOptions.children();
        troubleShootProvider.source = event.result.apx32.troubleShooting.children();
        fullList.source = event.result.apx32.children();
        returnedXml.source = event.result[0].children();
        myXmlSource = event.result[0];
    private function myXml_faultHandler(event:FaultEvent):void{
        Alert.show("Error loading XML");
        Alert.show(event.fault.message);
    private function app_creationComplete(event:FlexEvent):void{
        userOptions.scroller.setStyle("horizontalScrollPolicy", ScrollPolicy.OFF);
        myXml.send();
        //trouble.scroller.setStyle("horizontalScrollPolicy", ScrollPolicy.OFF);
        myXml = new HTTPService();
        myXml.url = "modules/apx32/apx32TroubleshootingXml.xml";
        myXml.resultFormat = "e4x";
        myXml.addEventListener(ResultEvent.RESULT, myXml_resultHandeler);
        myXml.addEventListener(FaultEvent.FAULT, myXml_faultHandler);
        myXml.send();
    private function troubleShootChange(event:IndexChangeEvent):void{
        dynamicButtons.removeAllElements();
        navControl.source = troubleShootProvider[event.newIndex].children();
        currImage = 0;
        imgList.source = troubleShootProvider[event.newIndex].images.children();
        definition.source = imgList[currImage].@url;
        if(imgList[currImage].@details == "true"){
            if(imgList[currImage].buttons.@hasButtons == "true"){
                for each(var item:XML in imgList[currImage].buttons.children()){
                    var newButton:LinkButton = new LinkButton();
                    newButton.label = item.@name;
                    newButton.x = item.@posX;
                    newButton.y = item.@posY;
                    newButton.setStyle("skin", null);
                    newButton.styleName = "dynamicButtonStyle";
                    dynamicButtons.addElement(newButton);
        //var isMultiPage:String = navControl[2]["multiPages"];
        //trace(isMultiPage);
        //        if(isMultiPage){
        if(currImage >= imgList.length - 1){
            next.visible = false;
            back.visible = false;
        else{
            back.visible = false;
            next.visible = true;
    private function customButtonPressed(event:Event):void{
        if(imgList[currImage].button.@changeTo != ""){
    private function userOptionsChange(event:IndexChangeEvent):void{
        dynamicButtons.removeAllElements();
        navControl.source = userOptionProvider[event.newIndex].children();
        currImage = 0;
        imgList.source = userOptionProvider[event.newIndex].images.children();
        definition.source = imgList[currImage].@url;
        if(imgList[currImage].@details == "true"){
            if(imgList[currImage].buttons.@hasButtons == "true"){
                for each(var item:XML in imgList[currImage].buttons.children()){
                    var newButton:LinkButton = new LinkButton();
                    newButton.label = item.@name;
                    newButton.x = item.@posX;
                    newButton.y = item.@posY;
                    newButton.setStyle("skin", null);
                    newButton.styleName = "dynamicButtonStyle";
                    newButton.addEventListener(MouseEvent.MOUSE_DOWN, customButtonPressed);
                    dynamicButtons.addElement(newButton);
        var isMultiPage:String = navControl[2]["multiPages"];
        if(isMultiPage == "true"){
            if(navControl[2]["next"] == "NEXT STEP"){
                navContainer.x = 630;
            else{
                navContainer.x = 640;
            next.label = navControl[2]["next"];
            back.label = navControl[2]["back"];
        if(currImage >= imgList.length - 1){
            next.visible = false;
            back.visible = false;
        else{
            back.visible = false;
            next.visible = true;
    private function nextClickHandler(event:MouseEvent):void{
        currImage += 1;
        dynamicButtons.removeAllElements();
        if(currImage >= imgList.length-1){
            currImage = imgList.length - 1;
            //next.visible = false;
            next.label = "YOU'RE DONE";
        else
            next.label = navControl[2]["next"];
        back.visible = true;
        if(imgList[currImage].@details == "true"){
            if(imgList[currImage].buttons.@hasButtons == "true"){
                for each(var item:XML in imgList[currImage].buttons.children()){
                    var newButton:LinkButton = new LinkButton();
                    newButton.label = item.@name;
                    newButton.x = item.@posX;
                    newButton.y = item.@posY;
                    newButton.setStyle("skin", null);
                    newButton.styleName = "dynamicButtonStyle";
                    dynamicButtons.addElement(newButton);
        definition.source = imgList[currImage].@url;
    private function backClickHandler(event:MouseEvent):void{
        currImage -= 1;
        dynamicButtons.removeAllElements();
        if(currImage == 0){
            back.visible = false;
        next.visible = true;
        next.label = navControl[2]["next"];
        if(imgList[currImage].@details == "true"){
            if(imgList[currImage].buttons.@hasButtons == "true"){
                for each(var item:XML in imgList[currImage].buttons.children()){
                    var newButton:LinkButton = new LinkButton();
                    newButton.label = item.@name;
                    newButton.x = item.@posX;
                    newButton.y = item.@posY;
                    newButton.setStyle("skin", null);
                    newButton.styleName = "dynamicButtonStyle";
                    dynamicButtons.addElement(newButton);
        definition.source = imgList[currImage].@url;
</code>
i have attached a copy of the xml that i have right now to this post for reference...
any help will be greatly appretiated!!! i've been stuck on this problem for the last week and my project is due soon
again thank you in advance...

Answer 1

hey david... just nevermind my previous post... I was able to subclass a link button, so i now have two variables that get assigned to a link button,
one is "tabId" <-- contains the information on which tab to swtich to, and the second is, "changeTo"... this contans the label name which it needs to switch to
I'm just stuck on how to change my selected item in my tabNavigator/list
the code i have right now is
    private function customButtonPressed(event:Event):void{
        if(event.currentTarget.tabId == "troubleShooting"){
            for each(var item:Object in troubleShootProvider){
                if(item.@label == event.currentTarget.changeTo){
    private function userOptionsChange(event:IndexChangeEvent):void{
        dynamicButtons.removeAllElements();
        navControl.source = userOptionProvider[event.newIndex].children();
        currImage = 0;
        imgList.source = userOptionProvider[event.newIndex].images.children();
        definition.source = imgList[currImage].@url;
        if(imgList[currImage].@details == "true"){
            if(imgList[currImage].buttons.@hasButtons == "true"){
                for each(var item:XML in imgList[currImage].buttons.children()){
                    var newButton:customLinkButton = new customLinkButton();
                    newButton.label = item.@name;
                    newButton.tabId = item.@tab;
                    newButton.changeTo = item.@changeTo;
                    newButton.x = item.@posX;
                    newButton.y = item.@posY;
                    newButton.setStyle("skin", null);
                    newButton.styleName = "dynamicButtonStyle";
                    newButton.addEventListener(MouseEvent.MOUSE_DOWN, customButtonPressed);
                    dynamicButtons.addElement(newButton);
        var isMultiPage:String = navControl[2]["multiPages"];
        var videoPresent:String = navControl[1]["videoPresent"];
        if(videoPresent == "true"){
            if(isMultiPage != "true"){
                navContainer.x = 825;
        if(isMultiPage == "true"){
            if(navControl[2]["next"] == "NEXT STEP"){
                navContainer.x = 630;
            else{
                navContainer.x = 640;
            next.label = navControl[2]["next"];
            back.label = navControl[2]["back"];
        if(currImage >= imgList.length - 1){
            next.visible = false;
            back.visible = false;
        else{
            back.visible = false;
            next.visible = true;
as you know, my xml gets divided into two saperate xmllistcollections one is the userOptionProvider, and the troubleshootingProvider
as is in the following xml
<mx:TabNavigator id="tabNav" width="275" tabStyleName="tabStyle" fontWeight="bold" height="400" paddingTop="0"
                         tabWidth="137.5" creationPolicy="all" borderVisible="false">
            <mx:VBox label="USER OPTIONS" width="100%" height="100%" horizontalScrollPolicy="off" verticalScrollPolicy="off">
                <s:List id="userOptions" width="100%" height="100%" itemRenderer="modules.apx32.myComponents.listRenderer"
                        borderVisible="false" contentBackgroundColor="#e9e9e9"
                        change="userOptionsChange(event)">
                    <s:dataProvider>
                        <s:XMLListCollection id="userOptionProvider" />
                    </s:dataProvider>
                </s:List>
            </mx:VBox>
            <mx:VBox label="TROUBLESHOOTING">
                <s:List id="trouble" width="100%" height="100%" itemRenderer="modules.apx32.myComponents.listRenderer"
                        borderAlpha="0" borderVisible="false" contentBackgroundColor="#e9e9e9"
                        change="troubleShootChange(event)">
                    <s:dataProvider>
                        <s:XMLListCollection id="troubleShootProvider" />
                    </s:dataProvider>
                </s:List>
            </mx:VBox>
        </mx:TabNavigator>
Im having some trouble updating my list... basically change to the troubleshooting tab, and then select the one that i need...
hopefully that makes sence...