help with a dynamically loaded menu

[TeaCake]

So I have a menu with options that load dynamically from an XML file and that works pretty well. They've all got eventListeners attached for MouseOvers and that's good too. The place where I'm having an issue is I need to add a Click eventListener to each one that will load the appropriate content for that option. Each option should load the same page with variable content, according to the address specified for that option. I've got the addresses listed with each option inside the XML file, and I've pushed them into an array. I just can't wrap my head around how to get the options to reference them. Here's my code so far:

var blogData:XMLList;
var blogTotal:Number;

var entryTitle:String;

//Arrays
var entriesArray:Array = new Array();
var entryAddr:Array = new Array();

var blogListLoader: URLLoader = new URLLoader();
blogListLoader.load(new URLRequest("BlogEntries.xml"));
blogListLoader.addEventListener(Event.COMPLETE, loadBlogList);

function loadBlogList(e:Event):void
{
var blogList:XML = new XML(e.target.data);
blogData = blogList.ENTRY;
blogTotal = blogData.length();
}


function loadBlogEntries():void
{
//Load entriesArray
var yTmp:Number = 0;
for (var i:Number = 0; i < blogTotal; i++)
{
    var entryName = blogData[i].@TEXT;
    var entry:TextField = new TextField();
    entriesArray[i] = entry;
    entriesArray[i].textColor = 0x0DAC54;
    entriesArray[i].x = 0;
    entriesArray[i].y = yTmp;
    entriesArray[i].width = 1031;
    entriesArray[i].height = 90.30;
    entriesArray[i].embedFonts = true;
    entriesArray[i].antiAliasType = AntiAliasType.ADVANCED;
    entriesArray[i].defaultTextFormat = listformat;
    entriesArray[i].selectable = false;
    entriesArray[i].wordWrap = true;
    entriesArray[i].text = entryName;
    entriesArray[i].autoSize = TextFieldAutoSize.LEFT;
    entriesArray[i].addEventListener(MouseEvent.MOUSE_OVER , bEntryOvr);
    entriesArray[i].addEventListener(MouseEvent.CLICK , bEntryClick);
    BlogPage.blogEntriesPage.entryList.addChild(entriesArray[i]);
    yTmp = yTmp + 149;

    var Addr = blogData[i].@ADDR;
    entryAddr[i] = Addr;
}



}

function bEntryOvr(event:MouseEvent):void
{
event.target.backgroundColor = 0x0DAC54;
event.target.background = true;
event.target.textColor = 0x000000;
event.target.addEventListener(MouseEvent.MOUSE_OUT , bEntryOut);
}

function bEntryOut(event:MouseEvent):void
{
event.target.background = false;
event.target.textColor = 0x0DAC54;
event.target.removeEventListener(MouseEvent.MOUSE_OUT , bEntryOut);
}

function bEntryClick(event:MouseEvent):void
{
showPage = showBlogEntry;
flashup();
}

I don't imagine it's probably very hard, but it's currently blowing my mind. Any insights are appreciated.

Thanks, -T.

[svenjoypro]

I'm sure there are other ways of doing this, but this should work for you. Most of Flash's built in classes (MovieClip, Sprite, TextField, etc) have an attribute "name" which you can use to store a symbol's name (obviously). The trick is to use that to your advantage. So for your code I would give each entriesArray[i] a name, like ea0, ea1, ea2, ea3, etc.

...
entriesArray[i].name = "ea"+i; // HERE
entriesArray[i].addEventListener(MouseEvent.MOUSE_OVER , bEntryOvr);
entriesArray[i].addEventListener(MouseEvent.CLICK , bEntryClick);

Then in your click listener get the name, strip off 'ea' and you're left with the array index.

function bEntryClick(event:MouseEvent):void
{
   var i:int = int(String(event.target.name).substring(2));
   //i now contains the array index of the clicked TextField
   trace(entriesArray[i].text);

   showPage = showBlogEntry;
   flashup();
}

Hopefully this is what you're asking for.

[[afz]snickelfitz]

Heres'a very basic set of classes that use an internal xml object (for clarity and simplicity; the downstream processes are the same for external XML)
The Btn class illustrates the use of setters and getters to assign and retrieve private instance properties as well as executing other code while doing so. (such as assigning a string to the textfield.text, resizing the button shape to fit the text, and repositioning the textfield.)

The links are assigned to an instance property of the button class, then retrieved in the click handler.

>

Create a new empty AS3 FLA; save to a folder on the desktop.
Paste the following code blocks into new AS3 class files, named as shown, and save them to the same directory as the FLA.
Set the Document class of the FLA to Main.
Compile the SWF.

Main.as

package 
{
    import flash.display.*;
    import flash.events.*;
    
    public class Main extends Sprite
    {
        private var xml:XML;
        private var menu:Sprite;
        
        public function Main()
        {
            xml =
            <site>
                <item title="Home" link="home.swf"/>
                <item title="About us" link="about.swf"/>
                <item title="Portfolio" link="porfolio.swf"/>
                <item title="Contact Us" link="contact.swf"/>
                <item title="Gallery" link="gallery.swf"/>
            </site>
            
            menu = new Sprite();
            var pad:Number = 2;
            var bY:Number = 0;
            
            for each (var itm in xml.item)
            {
                var b:Btn = new Btn();
                b.link = itm.@link;
                b.label = itm.@title;
                b.addEventListener(MouseEvent.CLICK, onClick, false, 0, true);
                b.x = 0;
                b.y = bY;
                menu.addChild(b);
                
                bY = menu.height + pad;
            }
            
            addChild(menu);
        }
        
        private function onClick(e:MouseEvent):void
        {
            trace(e.target.link);
        }
    }
}

Btn.as

package 
{
    import flash.display.*;
    import flash.events.*;
    import flash.text.*;
    
    public class Btn extends Sprite
    {
        private var _link:String;
        private var _label:String;
        private var btnLabel:TextField;
        private var btnBase:Shape;
        private var labelText:String;
        
        public function Btn()
        {
            btnBase = new Shape();
            var g:Graphics = btnBase.graphics;
            g.beginFill(0xEEEEEE);
            g.drawRect(0,0,120,30);
            g.endFill();
            addChild(btnBase);
            
            btnLabel = new TextField();
            btnLabel.autoSize = TextFieldAutoSize.LEFT;
            this.label = "default";
            addChild(btnLabel);
            
            mouseChildren = false;
            buttonMode = true;
            addEventListener(MouseEvent.ROLL_OVER, onOver, false, 0, true);
            addEventListener(MouseEvent.ROLL_OUT, onOut, false, 0, true);
        }
        
        private function onOver(e:MouseEvent):void
        {
            labelText = _label;
            this.label = "Click this button to trace its link!"
            btnBase.alpha = .5
        }
        
        private function onOut(e:MouseEvent):void
        {
            this.label = labelText;
            btnBase.alpha = 1;
        }
        
        public function set link(value:String):void
        {
            _link = value;
        }
        
        public function get link():String
        {
            return _link;
        }
        
        public function set label(value:String):void
        {
            _label = value;
            btnLabel.text = _label;
            btnBase.width = btnLabel.width + 20;
            btnBase.height = btnLabel.height + 20;
            btnLabel.x = btnBase.width/2 - btnLabel.width/2;
            btnLabel.y = btnBase.height/2 - btnLabel.height/2;
        }
        
        public function get label():String
        {
            return _label;
        }
    }
}

[TeaCake]

Thanks guys! I ended up going with Svenjoy's solution as it was very quick to implement and did what I needed. I appreciate your answer as well Snickelfitz, but it's a little beyond the scope of what I can comprehend at this point. Looks nice though. I'm sure I'll revisit at some point.

Thanks!