Apache Adobe Flex TutorialTutoriaux Adobe Flex & AIR en Français

Flex Modules – Passage de data dans l'URL (Query String)

Pour échanger de la donnée avec un module, vous pouvez ajouter des paramètres à l'URL qui sert à charger votre module Flex. Vous pouvez ensuite faire un parse de cette query string grâce à de l'ActionScript pour accéder à la donnée.

Depuis le module, vous pouvez accéder à l'URL en utilisant la propriété "loaderInfo". Cette propriété pointe vers l'objet flash.display.LoaderInfo du SWF qui charge (dans ce cas, l'application mère). Plusieurs informations sont disponibles dans l'objet LoaderInfo dont la progression du téléchargement, les URLs du loader et du contenu chargé, la taille de l'application ou même la hauteur et la largeur de l'application.

L'application suivante crée une Query String qui inclut les paramètres firstName et lastName:

<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
                height="500"
                width="400">
  <mx:Script>
    <![CDATA[
      public function initModule():void {
        // Build query string so that it looks something like this:
        // "QueryStringModule.swf?firstName=Nick&lastName=Danger"
        var s:String = "http://www.flex-tutorial.fr/wp-content/uploads/ModulesQueryString/QueryStringModule.swf?" + "firstName=" + ti1.text + "&lastName=" + ti2.text;
        // Changing the url property of the ModuleLoader causes
        // the ModuleLoader to load a new module.
        m1.url = s;
      }
    ]]>
  </mx:Script>
  <mx:Form>
    <mx:FormItem id="fi1"
                 label="First Name:">
      <mx:TextInput id="ti1" text="Fabien"/>
    </mx:FormItem>
    <mx:FormItem id="fi2"
                 label="Last Name:">
      <mx:TextInput id="ti2" text="Nicollet"/>
    </mx:FormItem>
  </mx:Form>
  <mx:ModuleLoader id="m1"/>
  <mx:Button id="b1"
             label="Submit"
             click="initModule()"/>
</mx:Application>

Le module suivant faire un parse de l'URL qui a été utilisée pour le charger. Si les paramètres firstName et lastName sont fixés, le module affiche le résultat dans un TextArea. Le module fait aussi un trace() d'autres informations disponibles sur l'objet LoaderInfo:

<?xml version="1.0"?>
<!-- modules/QueryStringModule.mxml -->
<mx:Module xmlns:mx="http://www.adobe.com/2006/mxml"
           creationComplete="parseString()">
  <mx:Script>
    <![CDATA[
      import mx.utils.*;

      [Bindable]
      private var salutation:String;

      public var o:Object = {};

      public function parseString():void {
        try {
          // Remove everything before the question mark, including
          // the question mark.
          var myPattern:RegExp = /.*\?/;
          var s:String = this.loaderInfo.url.toString();
          s = s.replace(myPattern, "");
          // Create an Array of name=value Strings.
          var params:Array = s.split("&");
          // Print the params that are in the Array.
          var keyStr:String;
          var valueStr:String;
          var paramObj:Object = params;
          for (keyStr in paramObj) {
            valueStr = String(paramObj[keyStr]);
            ta1.text += keyStr + ":" + valueStr + "\n";
          }
          // Set the values of the salutation.
          for (var i:int = 0; i < params.length; i++) {
            var tempA:Array = params[i].split("=");
            if (tempA[0] == "firstName") {
              o.firstName = tempA[1];
            }
            if (tempA[0] == "lastName") {
              o.lastName = tempA[1];
            }
          }
          if (StringUtil.trim(o.firstName) != "" && StringUtil.trim(o.lastName) != "") {
            salutation = "Bienvenue " + o.firstName + " " + o.lastName + "!";
          } else {
            salutation = "Le nom entré n'est pas complet."
          }
        } catch (e:Error) {
          trace(e);
        }
        // Show some of the information available through loaderInfo:
        trace("AS version: " + this.loaderInfo.actionScriptVersion);
        trace("App height: " + this.loaderInfo.height);
        trace("App width: " + this.loaderInfo.width);
        trace("App bytes: " + this.loaderInfo.bytesTotal);
      }
    ]]>
  </mx:Script>
  <mx:Label text="{salutation}"/>
  <mx:TextArea height="100"
               width="300"
               id="ta1"/>
</mx:Module>

Flex Source Code Download: Télécharger le code source complet de l'application

Les modules sont mis en cache suivant leur URL, dont la QueryString. Vous allez donc charger une nouveau module si vous changez l'URL ou n'importe quel paramètre passé dans l'URL. Cela peut être utile si vous voulez plusieurs instances du module, basées sur les paramètres que vous passez dans l'URL.