XML to TextField

I’ve managed to really frustrate myself trying to find a good tutorial on how to use ActionScript to grab an XML doc and place it’s contents in a simple textfield.

I’ve gotten an XML doc in a listbox and in a combobox without any problem thanks to a number of good tutorials - however, the textfield is escaping me.

I know that simple questions are frequently answered in generalities on this board, but I would appreciate if someone could provide me a link to a tutorial on this, or a simple code example that is laying around.

I’m in a new job that requires more Flash then I’ve ever had to do - I’m a PHP guy. I’ll learn this stuff much more quickly if I see examples.

Thanks for your help!

-b

the question remains, how do you want it formatted?

This may make my ignorance a little more transparent, but if you mean the font face, size and other attributes - I know how to do that already.

However, if you are referring to how I want the textfield displayed to the user, I would like it to closely resemble an HTML Form field.

Does that answere your question? I truly appreciate your patience.

Thanks!

-b

Let me qualify a little further. I have a multi-line blob of text that I want to stick into a form field. It will need a verticle scroll bar.

Thanks!

-b

so this isnt a question about xml but rather about just getting text into a field?

See thats whats confusing me. You said you got xml into a combobox all good and fine, but thats about 10 times more difficult then throwing some text into a field. That requires not only parsing the xml appropriately but also correctly inserting the retrieved information into the combobox where you want it. A textfield on the other hand is just TextFieldName.text = content or TextFieldVariable = content, theres not much about that. At least if you know how to extract the content from the XML which it seems you have down.

On the otherhand, if you have multiple attributes/nodes that you want specifically organized and formatted some way within your generic textField then that could require a little effort, though would be basically similar to the combo boxs deal, but just concatenating onto a string rather then individual selections.

So Im still a little unclear on what you want exactly and where the xml comes into play.

Sorry for the confusion.

Take a look at the files I have zipped for you. There are a few XML docs and one FLA file.

There are a few combo boxes that grab informarmation from the XML docs.

I have a textfield called “TXTSendMessage” That needs to grab the data from SendMessage.xml.

I had a feeling that this was ridiculously simple, but it is still escaping me.

The only way I figured out how to do the combo box was from a very good tutorial.

I am learning, but slowly.

If you could show me how to get that XML content into the textfield I would greatly appreciate it. I’d be able to run with the rest myself.

I was unable to attach the zip file, so here is a download location. It is just a little over 100k because of the Component Library.

http://www.wovknows.com/combo_box.zip

Thanks!

-b

You got me thinking on the right track. I tried to make this much more difficult that it was.

Here is my test file I got to work.

Thanks so much!

-b


ThisSendMessageXML = new XML();
ThisSendMessageXML.ignoreWhite = true;
ThisSendMessageXML.onLoad = function(success){
	if (success) TXTSendMessage.text = this.firstChild.firstChild.attributes["SendMessagesName"];
	}else trace("error loading ThisSendMessageXML");
};
ThisSendMessageXML.load("./xml/SendMessages.xml");

sets the text of TXTSendMessage to the attribute “SendMessagesName” in AllSendMessages’ (this’s firstNode) firstNode (site). heh

edit …didnt see that post :wink:

I love the open source community! Thanks so much for your willingness to help out!

-b

Speaking of which…I have an upcoming project where I am goi ng to have to manipulate the content of XML child nodes. Is this possibe to do through just Flash or am I going to need to go through a backend (if I do it will have to be jsp).

Thanks,
Michael

You can not only read XML with flash but also create and edit as well.

Senocular,
Can you point me in the direction of editing XML through Flash?

I would be thrilled as can be to bypass jsp. I know how to read it in, but not sure how to edit nodes.

Thanks so much,
Michael

hmm… I dont know any tutorials or anything off hand… All I can do now is suggest a search and check out Flash Help. If you cant dig up anything worthy, I can post a little walk through for ya here. People seem to think Im pretty good at that :wink:

I’ll see what I can dig up again…I looked around yesterday and came up empty…off to the races again…I’ll let you know if I uncover some hidden gem.

Thanks,
Michael

Senocular,
I can’t find anything out there as far as editing an XML child node goes,only to read a file in, which I understand fine. If you could post a lil walkthrough that would definitely rock :slight_smile:

Thanks,
Michael

ok … I cant now because I have to pretend Im working until the bosses leave :wink: Ill start in about 2 hrs or so (they should be gone by then) and post it when Im done.

I totally understand :)…hehe and thanks again for showing me the way :wink:

Michael

[size=4]Making and Working with XML Within Flash

XML Basics[/size]
Before making/editing XML, lets first learn what it is. That begins with understanding why XML is; why does it exist? Basically, XML was created to serve as an easily usable, readable method to format information within an basic text file. What it does is allows you to contain information (text/numbers) in a hierarchal manner. This means one bit of information can serve as a type of file folder for holding more information. In fact, you can think of XML just as that, as a text write-out of a hierarchical file system. It is NOT a script and does NOT “do” anything. It just provides information in an outlined and logically layed out manner. For more information beyond laymens terms, see:
http://www.xml.com/
http://www.w3.org/XML/

XML structure
Looking at XML, you’ll notice it looks a lot like HTML. In a way, HTML is a type of XML (though it was around before XML was) but the structure is in many cases the same. Heres a simple example of an XML file:


<**LETTER>
	<**TO>Sandy<**/TO>
	<**FROM>Joseph<**/FROM>
	<**BODY>I love you!<**/BODY>
<**/LETTER>

Its fairly easy to see what information this XML file holds and how its layed out. In the file folder metaphor, this represents a folder called LETTER which contains 3 other folders TO, FROM and BODY. Each one of those folders contains the given text. The folder TO for example has “Sandy” in it.

The XML itself is made up primarily of 2 things, Nodes and Attributes. Each one of these are containters for information, though attributes are special in that they are contained only within nodes. In the example above, each one of the ‘folders’ (ie LETTER, TO, etc.) are a node. Nodes, as the name suggests, are containers which can hold textual information (in Attributes) as well as have within them other nodes as seen above. Its this encapsulation which makes up the heirarchy of a XML file defining its structure.

There are no attributes in the LETTER XML example, and often attributes aren’t used at all. However, they can be useful in specifying properties or little tid-bits of information within a given node. Here is an example that uses attributes:


<**THURSDAY>
	<**MEETING TIME="10:00">
		The meeting was boring. I made paper airplanes with a memo I recieved earlier.
	<**/MEETING>
	<**LUNCH TIME="1:30">
		John came over to talk to me.  He smells funny today.
		<**SERVED MAINCOURSE="Steak" SIDE1="Apple" SIDE2="Mustard" DRINK="TANG" />
		<**SPENT MEALCARD="0" CASH="12.00" />
	<**/LUNCH>
<**/THURSDAY>

MEETING, for example, contains the attribute TIME. TIME’s value is 10:00. In HTML attributes would be like the href or target options within an anchor <a></a> tag. TIME just gives you a way to specify some extra information which is associated directly with that node.

This example demonstrates two other things as well. One thing is that nodes with out any child nodes, or nodes within it, can be terminated within their own tag using /> instead of re-writing the tag over again in closing tag. For example, <NODE1></NODE1> can be instead be written as <**NODE1 />. This is seen with the SERVED and SPENT nodes within LUNCH. Also (the other thing), you can see how the text in the LUNCH node - “John came over to talk to me. He smells funny today.” - sits pleasantly with the other nodes SERVED and SPENT. This is because that text is itself a node. Its a text node. It doesnt have any bracket tags nor any attributes or child nodes (folders in itself). All it is is just text - its a text node! :slight_smile: The first example also had text nodes. “Sandy”, “Jospeph” and “I love you!” were all text nodes. Non-text nodes can also be refered to as “Elements”.

Hopefully, for those of you who didnt know anything or knew little about XML, this cleared some things up or gave you an idea on how to perceive XML. Next is XML in Flash :beam:

[size=4]XML in Flash[/size]
So whats the big deal about XML in Flash? Nothing really. Its just XML… and Flash. Flash allows you to load, interpret and edit XML information. Not only that but Flash can make XML on the fly. Theres no real secret hidden goodness to there being XML support in Flash other than that now you have an easy way to pass and use structured information to Flash via a text file. Now there have been entire books written on the subject so what Im about to say here is undoubtedly only a small part of the big picture. Though its my intent to present this information in a way that makes it easy to understand in a simplified fashion (like XML :)) but in a way which should help you get up and running and using XML in Flash fairly effortlessly directly afterwards.

XML Object
First things first. Theres Flash, and then theres XML. They are not the same thing. This may seem obvious but its something you’ll have to remind yourself when you’re working with XML in Flash. This is because XML in flash is not text as it is in a xml text file, rather, its a Flash Object - an XML object to be exact. This XML object is not too terribly different from any generic object you make in Flash, so dont let the fact that its an “XML” object intimidate you. Being an XML object basically means it gains some extra functions and properties that generic objects dont normally have. This XML object, however, is what contains the structure of your XML within itself - itself as a Flash object, not as text.

So lets think about how a generic Object object in flash is structured. Heres an example.


myObj = new Object(5);
myObj.myProp1 = "my first property";
myObj.myProp2 = "my second property";
myObj.myArray = new Array(1,2,3);

This makes an object with a base value of 5, giving it the properties myProp1 and myProp2, each being a text value.


trace(myObj); // traces 5
trace(myObj.myProp1); // traces "my first property"
trace(myObj.myProp2); // traces "my second property" 
trace(myObj.myArray); // traces 1,2,3

no big deal right? As you should already know, objects in Flash are themselves containers for information. They contain variables/properties/methods and even other objects. Hmm this sounds familiar… SO DOES XML! So here we have a match made in heaven - XML file == Flash object. And thats what the XML object does for Flash. It takes XML data and presents it in a way to make it seem as though it were a Flash object. This makes working with XML information in Flash quite easy.

How exactly Flash translates XML into an XML object is done through the following:
[list]
[]The base XML object is an object containing the entire XML heirarchy beneath it
[
]All children of any given node (including those in the base XML object itself) are contained within an Array in that object called childNodes
[]Each Element Node contains a property nodeName (among others) giving its name
[
]Each Text Node contains a property nodeValue (among others) containing the text
[*]Attributes of an Element Node object are contained with an attributes object in that node object
[/list]
Lets make a basic example conversion through hardcoding an XML example into a generic Flash object. This wont be an EXACT replica of the XML object in flash, but its set up (minus some properties and methods) is similar. The XML:


<**HOMENODE> 
	<**ELEMENT1 PROPA="Hello" PROPB="Gday" />
	<**ELEMENT2 PROPA="Hi" PROPB="Ciao" />
	Random text insert
	<**ELEMENT3>
		More text
	<**/ELEMENT3>
<**/HOMENODE>

now, translated to a Flash object:


myXML = new Object();
myXML.childNodes = new Array();

myXML.childNodes[0] = new Object();
myXML.childNodes[0].nodeName = "HOMENODE";
myXML.childNodes[0].childNodes = new Array();

myXML.childNodes[0].childNodes[0] = new Object();
myXML.childNodes[0].childNodes[0].nodeName = "ELEMENT1";
myXML.childNodes[0].childNodes[0].attributes = new Object();
myXML.childNodes[0].childNodes[0].attributes.PROPA = "Hello";
myXML.childNodes[0].childNodes[0].attributes.PROPB = "Gday";

myXML.childNodes[0].childNodes[1] = new Object();
myXML.childNodes[0].childNodes[1].nodeName = "ELEMENT2";
myXML.childNodes[0].childNodes[1].attributes = new Object();
myXML.childNodes[0].childNodes[1].attributes.PROPA = "Hi";
myXML.childNodes[0].childNodes[1].attributes.PROPB = "Ciao";

myXML.childNodes[0].childNodes[2] = new Object();
myXML.childNodes[0].childNodes[2].nodeValue = "Random text insert";

myXML.childNodes[0].childNodes[3] = new Object();
myXML.childNodes[0].childNodes[3].nodeName = "ELEMENT3";
myXML.childNodes[0].childNodes[3].childNodes = new Array();
myXML.childNodes[0].childNodes[3].childNodes[0] = new Object();
myXML.childNodes[0].childNodes[3].childNodes[0].nodeValue = "More text";

Looking at this, and how the object is structured will let you see how things are layed out in an actual XML object (though it seems much more complicated in AS form). Its important to see how nodes themselves (which are ‘objects’) are contained within an array of their parent object and not as a direct object within that object, ie. instead of myXML.HOMENODE.ELEMENT1 you have the progression through the childNode arrays. This is mainly for reasons of ease in terms of navigation. Only the attributes object is a direct object off of the actual node object.

The XML object itself has more properties embedded in it that those which Ive included in that AS conversion above. These include properties such as nodeType, which will tell you whether or not a node is or an XML element node or a text node, and things like firstNode, the first node in a childNodes array and nextSibling which is the next node in the array in which the current node resides. For more detail can be found in Flash help. I may use these in the next section, so if you arent already familiar with them you might want to go look check them out now, or you could always look them up when the need arises. So onward to the purpose of all of this hoopla…

[size=4]Creating and Editing XML in Flash[/size]
Now that you finally know what XML is and how Flash sees XML you can start taking it apart and screwing around with its structure from within Flash. If not then you cheated and skipped the previous sections and need to go back and read them :wink:

Straight out, here are the methods used to make/edit your XML. We’ll go through each one and see how they work.
[list]
[]XML Object - new XML(“xml text”)
[
]XMLobj.parseXML(“xml text”)
[]XMLobj.createElement(“node name”)
[
]XMLobj.createTextNode(“text value”)
[]XMLobj/XMLnode.appendChild(childNode)
[
]XMLobj/XMLnode.insertBefore(childNode, beforeNode)
[]XMLobj/XMLnode.cloneNode(deep)
[
]XMLnode.removeNode()
[/list]

new XML(“xml text”)
Number 1 is the XML object itself, the constructor - how you make a new XML object to use in Flash. Chances are, if you’ve used XML in Flash, you’ve used this. What you might not have done was passed XML into the constructor to generate an XML object based off that XML text. Example:


my_xml = new XML("<**LETTER><**TO>Senocular<**/TO><**MESSAGE>Get a life<**/MESSAGE><**/LETTER>");
trace(my_xml.firstChild.nodeName); // traces LETTER
trace(my_xml.firstChild.firstChild.nodeName); // traces TO
trace(my_xml.firstChild.firstChild.firstChild.nodeValue); // traces Senocular

Easy! …next
note: using _xml at the end of your XML object name will give you code hints.

XMLobj.parseXML(“xml text”)
All this does is the same thing the XML object constructor does when passed XML text, but instead, it adds the XML to an already existant XML object replacing its current contents with the new.


my_xml = new XML();
my_xml.parseXML("<**LETTER><**TO>Senocular<**/TO><**MESSAGE>Get a life<**/MESSAGE><**/LETTER>");
trace(my_xml.firstChild.nodeName); // traces LETTER
trace(my_xml.firstChild.firstChild.nodeName); // traces TO
trace(my_xml.firstChild.firstChild.firstChild.nodeValue); // traces Senocular

Again, easy. partparseXML, however, can only be used on an XML object and not used on any one specific node. So if you want to parse some XML into an existing XML object, you would need to create a new XML object, and either using the constructor method, or parseXML, load the XML in then clone in or append the results to the current XML object.

XMLobj.createElement(“node name”)
This one is fairly self explanatory. What this does is creates an Element (node) with the given node name. The weird and possibly confusing thing is that this does NOT place the created node into the XML object, this only creates and returns a “free floating” node with the given name which can then be inserted into an XML structure anywhere you want using appendChild(). And yes this is a method of an XML object instance and not the XML object itself.

XMLobj.createTextNode(“text value”)
This is just like createElement but it creates a text node instead with the given text passed in. It too returns a “free floating” node which exists no where until you put it somewhere.

XMLobj.appendChild(childNode)
Here is where all the action comes into play. What this does is adds the passed node into the current XML object. This can be used by the XML object itself or any of its nodes adding the passed node into that specific XML or node object. Example:


my_xml = new XML();
my_xml.appendChild( my_xml.createElement("PICKUP") );
my_xml.firstChild.appendChild( my_xml.createElement("TRUCK") );
trace(my_xml.toString()); // traces <**PICKUP><**TRUCK /><**/PICKUP>
my_xml.firstChild.firstChild.appendChild( my_xml.createTextNode("Drive Me!") );
trace(my_xml.toString()); // traces <**PICKUP><**TRUCK>Drive Me!<**/TRUCK><**/PICKUP>

So basically, what appendChild does is just tacks on the new node onto the end of the childNodes array of the given XML or node object. It then gets assimilated into the XML and becomes one with the XML object :slight_smile:

XMLobj.insertBefore(childNode, beforeNode)
insertBefore is similar to appendChild, infact if the beforeNode is undefined or null, insertBefore will actually be equivalent to appendChild. insertBefore just allows you to position where you want a new node object to be placed in your childNodes array. Example:


my_xml = new XML("<**BASEBALLFIELD />");
my_xml.firstChild.appendChild( my_xml.createElement("FIRSTBASE") );
my_xml.firstChild.appendChild( my_xml.createElement("THIRDBASE") );
my_xml.firstChild.insertBefore( my_xml.createElement("SECONDBASE"), my_xml.firstChild.childNodes[1] );
trace(my_xml.toString()); // traces <**BASEBALLFIELD><**FIRSTBASE /><**SECONDBASE /><**THIRDBASE /><**/BASEBALLFIELD>

XMLobj.cloneNode(deep)
This method takes an existing node or XML object, copies it and returns it as a new node. The deep argument determines whether or not all of the child nodes of the cloned node are also copied and cloned. If deep is true, child nodes ARE copied, if false, they are NOT copied. Example:


my_xml = new XML("<**ALIENS><**INVADER>SuperKiller<**/INVADER><**/ALIENS>");
my_xml.firstChild.appendChild( my_xml.firstChild.firstChild.cloneNode(true) );
my_xml.firstChild.appendChild( my_xml.firstChild.firstChild.cloneNode(false) );
trace(my_xml.toString());
// traces <**ALIENS><**INVADER>SuperKiller<**/INVADER><**INVADER>SuperKiller<**/INVADER><**INVADER /><**/ALIENS>

notice how the last invader doesnt have a “SuperKiller” text node in it. This is because the deep argument was false on the second clone meaning no children were copied over into the returned clone node.

XMLobj.removeNode(node)
Last but not least, removeNode. It should be pretty apparent what this method does. Its the equivalent to MovieClip.removeMovieClip, only it removes nodes instead of movieclips. This is how you get rid of unwanted nodes in your XML object or other nodes within. Example:


my_xml = new XML("<**FUN /><**MONEY /><**FRIENDS /><**TAXES />");
trace(my_xml.toString()); // traces <**FUN /><**MONEY /><**FRIENDS /><**TAXES />
my_xml.childNodes[3].removeNode();
trace(my_xml.toString()); // traces <**FUN /><**MONEY /><**FRIENDS />

What about Attributes?
Attributes are not forgotten. They are just more “manual”. The attributes object can be manually edited just as any other object in Flash. This makes them easy to work with, without having to go through other XML methods. Example:


my_xml = new XML("<**FRIENDS />");
my_xml.firstChild.attributes.GIRLFRIEND = "Julie"
trace(my_xml.toString()); // traces <**FRIENDS GIRLFRIEND="Julie" />
delete my_xml.firstChild.attributes.GIRLFRIEND
trace(my_xml.toString()); // traces <**FRIENDS />

Now, with these tools and newly gained knowledge, you can create, edit and manage XML information directly within Flash. When dealing with serverside hosted XML, all you need to do is load the original data, manipulate it within Flash as shown above, then send your newly edited XML back to a server for an update with only minimal serverside scripting usage (only that needed to save and retrieve the XML text).