AS3 Save & Load multiple text boxs data to local f

Question

I am trying to create a form in flash (AS3) that can save data / text from multiple dynamic text box's into a user specified path & local file & also load any saved forms back into appropriate text box's. I have found some great examples on how to do this with a single text box. I know it should be simple however I cannot seem to figure it out or successfully mod existing examples to work with multiple text boxs?. any ideas?

Here's the code i'm currently using / trying to mod.

package 
{
import flash.display.Sprite;
import flash.display.Stage;
import flash.display.StageAlign;
import flash.display.StageScaleMode;
import flash.events.Event;
import flash.events.MouseEvent;
import flash.events.IOErrorEvent;
import flash.net.FileFilter;
import flash.net.FileReference;
import flash.net.URLLoader;
import flash.net.URLRequest;
import flash.text.TextField;
import flash.text.TextFieldAutoSize;
import flash.text.TextFieldType;
import flash.text.TextFormat;
import flash.utils.ByteArray;
import flash.xml.XMLDocument;

public class BinaryXMLTool extends Sprite 
{

    // ** minimalist buttons **
    private var browseButton:TextField;
    private var saveButton:TextField;

    // ** minimalist editor **
    private var xmlText:TextField;

    // ** browse/load/save **
    private var xmlFile:FileReference;

    public function BinaryXMLTool():void 
    {
        if (stage) init();
        else addEventListener(Event.ADDED_TO_STAGE, init);
    }

    private function init(e:Event = null):void 
    {
        removeEventListener(Event.ADDED_TO_STAGE, init);

        // entry point
        stage.align         = StageAlign.LEFT;
        stage.scaleMode         = StageScaleMode.NO_SCALE;
        stage.showDefaultContextMenu    = false;

        // ** draw minimalist text editor **
        xmlText             = new TextField();
        xmlText.multiline       = true;
        xmlText.background      = true;
        xmlText.backgroundColor     = 0xEEEEEE;
        xmlText.type            = TextFieldType.INPUT;
        xmlText.width           = 400;
        xmlText.height          = 400;
        xmlText.border          = true;
        xmlText.x           = 15;
        addChild(xmlText);

        // ** draw minimalist browse button **
        browseButton            = new TextField();
        browseButton.autoSize       = TextFieldAutoSize.LEFT;
        browseButton.background     = true;
        browseButton.backgroundColor    = 0x000000;
        browseButton.defaultTextFormat  = new TextFormat("Tahoma", 14, 0xFFFFFF, true, null, null, null, null, null, 4, 4);
        browseButton.selectable     = false;
        browseButton.text       = "BROWSE";
        browseButton.x          = (stage.stageWidth - browseButton.width) * 0.5;
        browseButton.y          = 420;
        addChild(browseButton);

        // ** draw minimalist save button **
        saveButton          = new TextField();
        saveButton.autoSize     = TextFieldAutoSize.LEFT;
        saveButton.background       = true;
        saveButton.backgroundColor  = 0xAAAAAA;
        saveButton.defaultTextFormat    = browseButton.defaultTextFormat;
        saveButton.selectable       = false;
        saveButton.text         = "SAVE";
        saveButton.x            = (stage.stageWidth - saveButton.width) * 0.5;
        saveButton.y            = 460;
        addChild(saveButton);

        // ** button listeners **
        browseButton.addEventListener(MouseEvent.CLICK, on_buttonClick,     false, 0, true);
        saveButton.addEventListener(MouseEvent.CLICK, on_buttonClick, false, 0, true);
    }

    /**
    * handle browse or save
    */
    private function on_buttonClick(evt:MouseEvent):void
    {
        var btn:TextField = evt.target as TextField;
        if (btn)
        {
            if (btn.text == "BROWSE")
            {
                xmlFile = new FileReference();
                xmlFile.addEventListener(Event.SELECT, on_xmlSelect, false, 0, true);
                xmlFile.browse([new FileFilter("XML Documents","*.xml")]);
            }
            else if (btn.text == "SAVE")
            {
                if (xmlFile)
                {
                    if (xmlText.text.length)
                    {
                        // ** saving as binary **
                        var data:ByteArray = new ByteArray();
                        data.writeUTFBytes(xmlText.text);
                        data.compress();
                        new FileReference().save(data, "bin" + xmlFile.name);
                    }
                }
            }
        }

    }

    /**
    * handle browse, load XML file
    */
    private function on_xmlSelect(evt:Event):void
    {
        xmlFile.removeEventListener(Event.SELECT, on_xmlSelect);
        xmlFile.addEventListener(Event.COMPLETE, on_xmlComplete, false, 0, true);
        xmlFile.load();
    }

    /**
    * handle load, check if it is binary, uncompress, display XML in editor
    */
    private function on_xmlComplete(evt:Event):void
    {
        xmlFile.removeEventListener(Event.COMPLETE, on_xmlComplete);

        saveButton.backgroundColor = 0x000000;

        var data:* = FileReference(evt.target).data;
        if (data is ByteArray)
        {
            try
            {
                ByteArray(data).uncompress();
            }
            catch(e:Error)
            {
            }

        }
        data = XML(data);
        xmlText.text = data;
    }
}   
}

Answer 1

Using the Flash Player you can save and load a local file using FileReference/save() and load(). However, this requires that the user choose the file location, and you have no control over it.

Alternatively, you can store data locally using SharedObject. This may require user permission, and it may be cleared by the user (purposefully or accidentally), for example through their browser's "clear local data" feature.

Using AIR, you can use the File class to read and write local files without any user interaction, or you can use EncryptedLocalStore.

(This question gets asked a lot, if you search around you will find more information.)

EDIT:

Looking at the example code you posted, it's expecting to write an XML string as zlib compressed bytes to a file. In your case, you want to save multiple values to a single file. You could do this by simply constructing a new XML object that contains those values, then read those values back out of the XML object. Here's an example that does this:

// Timeline instances
var textField1:TextField;
var textField2:TextField;
var saveBtn:SimpleButton;
var loadBtn:SimpleButton;

saveBtn.addEventListener(MouseEvent.CLICK, saveClick);
function saveClick(e:MouseEvent):void {
    // Save the state of both text fields
    save(textField1.text, textField2.text, "data.xml");
}

loadBtn.addEventListener(MouseEvent.CLICK, loadClick);
function loadClick(e:MouseEvent):void {
    load();
}

function save(text1:String, text2:String, defaultFileName:String):void {
    var xml:XML = <xml>
        <text1>{text1}</text1>
        <text2>{text2}</text2>
    </xml>;
    var file:FileReference = new FileReference();
    file.save(xml, defaultFileName);
}

function load():void {
    var file:FileReference = new FileReference();
    file.browse([new FileFilter("XML", "*.xml")]);
    file.addEventListener(Event.SELECT, loadSelect);
}

function loadSelect(e:Event):void {
    var file:FileReference = e.target as FileReference;
    file.addEventListener(Event.COMPLETE, loadComplete);
    file.load();
}

function loadComplete(e:Event):void {
    var file:FileReference = e.target as FileReference;
    var xml:XML = XML(file.data.readUTFBytes(file.data.bytesAvailable));

    // Assign the loaded XML text values back to the text fields
    textField1.text = xml.text1;
    textField2.text = xml.text2;
}