Articles: 843 | Categories: 148   
   
   
Home Articles Contact Us
 
 
 
 
Create a Guestook (0 Comments)
Admin: Posted Date: April 4, 2010

In this tutorial we will see how to create and manage a simple Guestbook using an XML formatted file. To do that we will create and parse the XML structure using an opensource library for PHP which allow us to threat XML with DOM.

Use phpdomxml to create a Guestook in Flash

Introduction

In this tutorial we will see how to create and manage a simple Guestbook using an XML formatted file (with a simple XSL style-sheet). To do that we will create and parse the XML structure using an opensource library for PHP which allow us to threat XML with DOM.
In particular this library uses the same DOM as the one installed in Flash. Which is a great thing!
In the end we will apply a custom XSL style sheet to our xml file in order to see it in a in a better way ;)

phpdomxml is an opensource library made by Bas van Gaalen ( http://webtweakers.com ).
The class implements the DOM XML standard without use special purpose PHP extensions. The properties and methods in this class are based on the properties and methods of ECMAScript like languages (like Actionscript) as described by the w3c.

What we need?

TIP: In order to understand the importance of XSL for formatting XML file I suggest you to read this tutorial before continue reading.
XSL = e X tensible S tylesheet L anguage. At the end we can define XSL as a set of languages that can transform XML into XHTML.

 

1 Create a simple Flash Form

Let's start with the most easy part of this tutorial. We will build a simple Flash Movie which send to our PHP page a set of data using the POST method and the LoadVars Object.

Open Flash and build a graphical interface like this picture:

We have:

  • 2 textinput components (sName and sEmail)
  • textArea component (sMessage)
  • 2 component button (sendBtn and cancelBtn)

And this is the code used in the Flash Form application:


// Import the Alert class in order to control the Alert window
import mx.controls.Alert
function doAlert(message, title){
    Alert.show(message,title);
}
// check if properties of the cecker object are set to true.
// If so, enable the sendBtn button, otherwise disable it
function checkForm(){
    if(checker.sName and checker.sEmail and checker.sMessage){
        sendBtn.enabled = true;
    } else {
        sendBtn.enabled = false;
    }
}
// Event listener for the textinput component
checker = {}
function textChanged( target ){
    checker[target.target._name] = target.target.text != ""
    checkForm();
}
// close current HTML window with click on the closeBtn
function closeWin(){
    getURL("javascript:window.close();");
}
// send form to PHP
function sendForm(){
    var myV = new LoadVars();
    myV.name = sName.text
    myV.email = sEmail.text
    myV.message = sMessage.text
    myV.player = getVersion();
    myV.action = "insert";
    myV.sendAndLoad("create.php", myV, "POST");
    myV.onLoad = function(){
        doAlert("Thank You " + sName.text + "! Your comment has been added to the guestbook!","Thanks");
        sendBtn.enabled = false;
        sName.removeEventListener("change", textChanged)
        sEmail.removeEventListener("change", textChanged)
        sMessage.removeEventListener("change", textChanged)
        // refresh the opener page
        getURL("javascript:window.opener.location.reload();");
    }
    sendBtn.enabled = false;
}

// set sendButton disabled by default sendBtn.enabled = false // Assign all the eventListener for the components sName.addEventListener("change", textChanged); sEmail.addEventListener("change", textChanged); sMessage.addEventListener("change", textChanged); sendBtn.addEventListener("click", sendForm); closeBtn.addEventListener("click", closeWin);

The code interesting is just the part which sends the variables to the PHP file:

// send form to PHP
function sendForm(){
var myV = new LoadVars();
myV.name = sName.text
myV.email = sEmail.text
myV.message = sMessage.text
myV.player = getVersion();
myV.action = "insert";
myV.sendAndLoad("create.php", myV, "POST");
myV.onLoad = function(){
doAlert("Thank You " + sName.text + "! Your comment has been added to the guestbook!","Thanks");
sendBtn.enabled = false;
sName.removeEventListener("change", textChanged)
sEmail.removeEventListener("change", textChanged)
sMessage.removeEventListener("change", textChanged)
// refresh the opener page
getURL("javascript:window.opener.location.reload();");
}
sendBtn.enabled = false;
}

First create a new LoadVars object.
Now put inside this object all the variables we want to send to PHP.
sName.text => value of the input component sName (the same for sEmail)
getVersion() => send to PHP the current flash player version used by our guest.
then make a sendAndLoad call to PHP.

sendAndLoad will send all the variables to the page requested and moreover will wait for the page response. Since I declared as second argument of the sendandload function the same loadvars object, this means that the responder of the php response will be the same object.
In fact with the onLoad function I receive the PHP output.

 

 

 

 
 
Add a Comment:
 
(You must be signed in to comment on an article. Not a member? Click here to register)
   
Title:

Comments: