A Simple XML-Based Searchable Database

We will first plan and build a stage. Just open the fla file and look at the stage. There are several dynamic textfields, an input field for the search engine and two empty movieclips, which we need for preloading and loading the swf files. You can also load jpg files in Flash MX but I have used swf files because the power of Flash using XML is to have animations played, which makes Flash different from other XML parsers. All textfields have var names except for the big central textfield, which has the textfield name ´InstanceName_0´. This is important, because we are attaching a scrollbar to this field in case the text is larger than the field. I have to thank the Flash MX discussion board where I learned how to do it correctly. The input field also gets a var name (var box in the property inspector). Further we put buttons on the stage but this is of course completely up to you. 

The Fla file: ActionScript for Buttons, Uploading the XML File

Now open the actions panel and have a look at the scripts. At the top of the page is the preload script. Check the script attached to modelHolder_1 to learn more about tracing the loading event.

We first create a general function with two arguments, which will be for the individual name buttons. We call the function ´showModel(modelName,fileName)´. The var modelName is the actual name of the model such as Kim for example. The var fileName is any XML file we want to upload.

//function to preload pics
function loadAll(firstPic,lastPic,picName){
  for (j=firstPic;j<=lastPic;j++) {
  duplicateMovieClip (_root.modelHolder_1,"pic_"+j, j);   
  setProperty ("pic_"+j, _alpha, (0));
  loadMovie(picName+j+".swf","pic_"+j);
  loadMovie(picName+j+".swf","modelHolder_1");
  setProperty("modelHolder_1",_alpha, (0));
  }
}
loadAll(1,6,"pic_");
loadMovie("agency.swf","modelHolder");

//general function to upload and get access to the xml files
//for the buttons
function showModel(modelName,fileName) {
  //this is to empty the preloader textfield
  counter="";
  //variables for the name of the model and for the xml file
  var modelName;
  var fileName;
  //uploading the xml, model is just an instance we use here
  model = new XML();
  model.onLoad = newModel;
  //this facilitates accessing the xml tree, since white
  //space is also considered childnode
  //the use of ignoreWhite, however, should be avoided if possible
  model.ignoreWhite = true;
  model.load(fileName);

 
The Fla file: ActionScript for Buttons, Accessing the XML File

We now have to get access to the XML file. We do that by creating a function containing a loop. In this function we search for the root node "models".

//function to get to the root node and the childnodes
function newModel() {
  //loop going through the xml file whereby childNodes.length is the number of child nodes
  for (var count01=0; count01<=model.childNodes.length; count01++) {
    //the root node name "models"
    if (this.childNodes[count01].nodeName.toLowerCase() == "models") {
      //this var holds the complete xml file
      modelsDescryption = this.childNodes[count01];
      }
    }
    //function to get access to individual childnodes
    //modelsDescryption will carry over the extracted contents from the previous
    //function to the next function
    findModels(modelsDescryption); 
  }

 
The Fla file: ActionScript for Buttons, Accessing Individual Child Nodes

In the next function we will get access to child nodes by using another loop. Compare by using trace the contents of the var modelsDyscryption of the previous function with this function and see the difference.

//here we use a new argument for the function
function findModels(myModel) {
  var myModel;
  var modelName;
  for (var count02=0; count02<=myModel.childNodes.length; count02++) {
    if (myModel.childNodes[count02].nodeName.toLowerCase() == modelName) {
    //we now have access to one childnode
    //now the var modelsDescryption holds only the contents of the first Child of
    //the childnode "modelName". modelName can be any of
    //the child nodes of our XML document
    modelsDescryption = myModel.childNodes[count02].firstChild;
    //this will show the firstChild content in the scrollbar textfield
    InstanceName_0.text = modelsDescryption;
    //here we are accessing the attribute "name"
    headline = myModel.childNodes[count02].attributes.name;
    //here we are accessing the attribute "photo"
    pic = myModel.childNodes[count02].attributes.photo;
    //we load the swf into an empty MC
    loadMovie(pic,"modelHolder");
    }
   }
  }
 }

 
The Fla file: ActionScript for search engine

The first part of the search engine script is similar to the above script except that we don't need any arguments. We do not only search in one XML file but in two. The search is performed by first uploading the XML file and then looking for string matches.

//this is the function for the search engine
function searchModel() {
  var modelName;
  model = new XML();
  model.onLoad = newModel;
  model.ignoreWhite = true;
  model.load("fmodels.xml");
  function newModel() {
    for (var count01=0; count01<=model.childNodes.length; count01++) {
      if (this.childNodes[count01].nodeName.toLowerCase() == "models") {
      modelsDescryption = this.childNodes[count01];   
      }
    }
   findMFModels(modelsDescryption); 
 }