XML for Flash & Ajax operations

Source: Internet
Author: User
Tags xml example

XML example of Flash & Ajax operations: Refreshing pagination

Effect Preview

In fact, the title is just a gimmick. I just want to talk about how Javascript and Actionscript operate XML.
I hope to help some friends who only use Javascript or only understand Actionscript and understand the similarities and differences between the two.

There are many types of connections between Flash and the background, and calling XML () by using Actionscript is a simple one,
Javascript calls xmlHttp, which is now a popular Ajax.

Now we will use a paging effect that often appears on the Internet to get started with Flash and Ajax.

In actual use, the XML file is usually generated through the background script, and then the data generated is operated.
Due to the length relationship, 1.xml 2.xml 3. xml will be used in this article. The background script is not described.

First, understand the structure of an XML file:

CODE:
<Data>
<Movie id = "1" type = "love"> happy terminal </movie>
<Movie id = "2" type = "terrorism"> desperate endpoint </movie>
<Movie id = "3" type = "Comedy"> terrorism movie </movie>
...
....
</Data>

Start with a simple Flash.

CODE:
Function setxml (page ){
PageXml = new XML (); // declare an XML Object
PageXml. ignoreWhite = true; // white space allowed
PageXml. load (page + ". xml? Rid = "+ Math. random (); // read the XML file
PageXml. onLoad = function (success)
{
If (success)
{
ParseXml (pageXml); // If the read is successful, analyze the XML file
}
}
}
Function parseXml (pageXml ){
Xmlroot = ageXml. firstChild; // defines the XML root directory
For (I = 0; I <xmlroot. childNodes. length; I ++)
{
AttachMovie ("tr", "tr _" + I, I); // generate a row
This ["tr _" + I]. _ x = 13;
This ["tr _" + I]. _ y = 25 * I + 33;
This ["tr _" + I]. no = xmlroot. childNodes [I]. attributes. id; // obtain the ID of a record
This ["tr _" + I]. name = xmlroot. childNodes [I]. firstChild; // name
This ["tr _" + I]. type = xmlroot. childNodes [I]. attributes. type; // type
Page = pageXml. firstChild. attributes. page; // get the current page
}
}
If (! Page) // The initial page number is the first page = 1;
Setxml (page); // initial first page content
Presetxmlbtn. onRelease = function ()
{
Setxml (page * 1-1); // flip the page forward and read the content
}
Nextbtn. onRelease = function ()
{
Setxml (page * 1 + 1); // flip the page to read the content
}

Next is Ajax.

CODE:

Var xmlHttp

/*
The first part is the statement about xmlHttp. Because IE is a little different from some other objects that browse to generate xmlHttp, It is troublesome to declare it.
Other main functions are equivalent to "new XML ()" in Flash mode. Of course, other functions are included.
*/
Function GetXmlHttpObject (handler)
{
Var objXmlHttp = null;
If (navigator. userAgent. indexOf ("MSIE")> = 0)
{
Var strName = "Msxml2.XMLHTTP ";
If (navigator. appVersion. indexOf ("MSIE 5.5")> = 0) // both methods are available for IE.
{
StrName = "Microsoft. XMLHTTP ";
}
Try
{
ObjXmlHttp = new ActiveXObject (strName );
ObjXmlHttp. onreadystatechange = handler;
Return objXmlHttp;
}
Catch (e)
{
Alert ("Error. Scripting for ActiveX might be disabled ");
Return;
}
}
Else
{
ObjXmlHttp = new XMLHttpRequest (); // Firefox, Opera, etc.
ObjXmlHttp. onload = handler;
ObjXmlHttp. onerror = handler;
Return objXmlHttp;
}
}

// The function to be called first, which can be considered as the setxml () function in Flash above,
Function showpage (no)
{
Document. getElementById ("loadstatus"). innerHTML = "Lading... ";
Var url = no + ". xml? Rid = "+ Math. random ();
// StateChanged_showplist is the name of the following function. Note that no parentheses are required.
XmlHttp = GetXmlHttpObject (stateChanged_showplist );
// The transfer method is GET or POST. Sometimes, when the variable is passed in Chinese, remember to set the file header.
XmlHttp. open ("GET", url, true );
XmlHttp. send (null );
}

// Analyze XML Functions
Function stateChanged_showplist ()
{
If (xmlHttp. readyState = 4 | xmlHttp. readyState = "complete") // xmlHttp. readyState = 4 4 indicates that the read is complete.
{
Document. getElementById ("loadstatus"). innerHTML = "";
Table = document. getElementById ("pagebody"); // generate a TALBE Element
For (I = table. rows. length-1; I> = 0; I-) // Delete the original row, otherwise the table will expand infinitely.
Table. deleteRow (I );
Xmlroot = xmlHttp. responseXML. getElementsByTagName ("movie"); // get the root required by XML

For (I = 0; I <xmlroot. length; I ++)
{
// Generate a table using a simple DOM.
Tr = table. insertRow (-1 );
Td = tr. insertCell (-1 );
Td. align = "center ";
Td. innerHTML = '<span class = "warntxt">' + xmlroot [I]. getAttribute ('id') + '</span> ';
Td = tr. insertCell (-1 );
Td. innerHTML = xmlroot [I]. firstChild. data;
Td = tr. insertCell (-1 );
Td. innerHTML = xmlroot [I]. getAttribute ('type ');
}

// Define the paging Link
Page = xmlHttp. responseXML. getElementsByTagName ("data") [0]. getAttribute ('page ')
If (page> 1)
{
Prepage = page * 1-1;
Var changpage = "<a href = 'javascript: showpage (" + prepage + ") '> previous page </a> ";
}
Else
{
Changpage = "Previous Page ";
}
If (page <3)
{
Nextpage = page * 1 + 1;
Changpage + = "<a href = 'javascript: showpage (" + nextpage + ") '> next page </a> ";
}
Else {
Changpage + = "next page ";
}
Document. getElementById ("changpage"). innerHTML = changpage;
}
}

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.