Flex Data Models

One of the powerful features of Flex is the <mx:model> tag. You can bind fields and variables to it; when a user updates a value in a TextInput, if that field is bound to a model, the value in the model will be updated too. You can then pass the model object to your server-side technology. Recently, I needed to pass some search parameters to an HTTPService:

<mx:model id="serviceModel">
<root>
<searchid>{this.searchID.text}</searchid>
<description>{this.searchDescription.text}</description>
<searchtype>{this.searchType}</searchtype>
</root>
</mx:model>

The above model object came in handy. It's basically an XML object with whatever structure you'd like to give it. Note the first two nodes off of <root> are bound to TextInput fields; the last is bound to a private variable. When the value of the variables change, so do their values in the model.

Then when I'm calling the HTTPService, I simply pass the model object to it:

serviceGridReader.send(this.serviceModel);

Wireshark - Must-have Utility for All Flex Developers

I was wrestling with a very subtle problem today: The Flex app was passing some variables to a Java servlet via an HTTPService,

var params:Object = new Object();
params.ServiceType = "INITIALIZE";
params.SearchID = searchID.text;
params.Description = searchDescription.text;
serviceGridReader.send(params);

Using the Wireshark tool, I filtered the capture to only give me the packets for my server. I noticed that the above params data was being sent to the server as XML. Hmm. I had the following further up in the code,

serviceGridReader.contentType = "application/xml";

I created a simple HTML page with a form and a submit button, passing the same data in hidden fields. Lo and behold -- the servlet worked fine with that. Using Wireshark, I noticed the data was being passed in this format from the HTML form,

Description=&ServiceType=INITIALIZE&SearchID=PANUNC

Once I commented out the line setting the contentType, the servlet was happy with a simple request.getParameter("ServiceType").

Flex and XML - Don't Forget the ContentType

Hi, all. Hope everyone had a great weekend. I came across an interesting problem last week with Flex 3: A Java servlet produced perfectly fine XML via the SAX (Simple API for XML) package, but the SWF file kept having a hiccup when it tried to read the data,

private function useHttpService():void {
service = new HTTPService();
service.url = "http://myserver/myServlet";
service.method = "POST";
service.addEventListener("result", httpResult);
service.addEventListener("fault", httpFault);
service.send();
}

private function httpResult(event:ResultEvent):void {
premiums = XML(event.result);

// Read the XML directly (E4X) in the datagrid.
this.dgPremiums.dataProvider = premiums.premium;
}

// Fetch the rootCause and display in Alert.
private function httpFault(event:FaultEvent):void {
var errorMessage:ErrorMessage = event.message as ErrorMessage;
Alert.show("rootCause: " + errorMessage.rootCause.toString());
}

In the above code, I changed the FaultEvent handler to display an object as an ErrorMessage, as per Sujit's great article. Finally, it showed the error,

IOErrorEvent type="ioError" bubbles=false cancelable=false eventPhase=2 text="Error #2032: Stream Error. URL: myServlet"

Hmm. Flex errors can sometimes be tricky. A quick check on a Flex error lookup tool, and this page provided some answers, though not what I thought. One person had posted about having to remove the contentType from the HTTPService object. Mine was missing it. So I added it and voila! Flex fetched the data with no errors.

A little more digging and I realized that my Java servlet was emitting XML data, with the contentType set to "text/xml". Flex needed that hint of what data to expect. So adding this line to the useHTTPService() method fixed the headache,

service.contentType = "application/xml"; // Must have this or will get IOError -- servlet generates XML document.