Note:The current release is Flex 4. This page is for Flex 3. To get started with Flex 4 and Flash Builder 4 (formerly known as Flex Builder), see the Getting Started page on the Flex Developer Center.
This section provides the completed code for the Shipping Costs Flex 3 application. To see the application in action, see the Part II Introduction or the Code Anatomy. For step-by-step instructions to build this application, see the Tutorial.
The Shipping Costs Flex application code is available below in two categories, with three versions each, that only differ by one line of code:
<?php
// shipping.php contains our get_shipping_options($zipcode, $pounds) function.
// It returns an array mapping service name to price in US dollars.
require ('shipping.php');
$options = get_shipping_options($_REQUEST[zipcode], $_REQUEST[pounds]);
foreach ($options as $service => $price) {
$result[] = "$service: $price USD";
}
print implode("\n", $result);
?>
JSP and JAVA files
Plain text example
PlainHttpService.jsp
<%@page import="quickstart.ShippingCalculator,
quickstart.ShippingOption,
java.util.List" %>
<%
ShippingCalculator calc = new ShippingCalculator();
List options;
int zipcode;
double pounds;
zipcode = Integer.parseInt(request.getParameter("zipcode"));
pounds = Double.parseDouble(request.getParameter("pounds"));
options = calc.getShippingOptions(zipcode, pounds);
for (int i = 0; i < options.size(); i++) {
ShippingOption option = (ShippingOption) options.get(i);
%><%= option.getService() %>: <%= option.getPrice() %> USD
<%
}
%>
XML example
xmlHttpService.java
<%@page import="quickstart.ShippingCalculator,
quickstart.ShippingOption,
java.util.List" %>
<?xml version="1.0" encoding="utf-8"?>
<options>
<%
ShippingCalculator calc = new ShippingCalculator();
List options;
int zipcode;
double pounds;
zipcode = Integer.parseInt(request.getParameter("zipcode"));
pounds = Double.parseDouble(request.getParameter("pounds"));
options = calc.getShippingOptions(zipcode, pounds);
for (int i = 0; i < options.size(); i++) {
ShippingOption option = (ShippingOption) options.get(i);
%>
<option>
<service><%= option.getService() %></service>
<price><%= option.getPrice() %></price>
</option>
<%
}
%>
</options>
ShippingCalculator.java
package quickstart;
import java.util.ArrayList;
import java.util.List;
import java.lang.Math;
public class ShippingCalculator {
/* Returns a list of made-up ShippingOptions.
*/
public List getShippingOptions(int zipcode, double pounds) {
List options = new ArrayList();
double baseCost;
baseCost = Math.round(zipcode / 10000) + (pounds * 5);
options.add(new ShippingOption("Next Day", baseCost * 4));
options.add(new ShippingOption("Two Day Air", baseCost * 2));
options.add(new ShippingOption("Saver Ground", baseCost));
return options;
}
}
ShippingOption.java
package quickstart;
public class ShippingOption {
privateString service;
privatedouble price;
public ShippingOption() {
}
public ShippingOption(String aService, double aPrice) {
this.service = aService;
this.price = aPrice;
}
public void setService(String value) {
this.service = value;
}
public void setPrice(double value) {
this.price = value;
}
publicString getService() { returnthis.service; }
publicdouble getPrice() { returnthis.price; }
}
ASP.NET files
To use the ASP.NET files, you must create a virtual directory in the IIS Manager named
"quickstart". You must then create a subdirectory named "bin". Compile the two C# files
into quickstart.dll, and copy that DLL into the bin directory.
I'm very new to Flex and I was wondering why in almost every example I see a mixing of ActionScript with the MXML. I am a big fan of the MVC approach to programming, and these tutorials don't do the best job of reinforcing such practices.
I was wondering, is it even possible to declare the HTTPService in ActionScript, or is this something that can only be declared in an MXML file?
My preferred way would be to leave the MXML for just the layout and design, and put all of the application logic, including all event handlers, in separate files. Is this a common strategy used by Flex developers?
You're right, William, the examples in the doc don't generally show using MVC or other patterns in the code. This is because the examples need to be concise and simple so that the code can be copied and pasted into any application. Adding the weight of a pattern would make it difficult for new users to understand the code, and for experienced users to reuse the code in their own applications.
The ASP.NET source docs use a namespace of quickstart, which fails (using MS developer express 2008) - Any suggestions? The zip file doesnt contain any ref for a quickstart lib.
To use the ASP.NET files, you must create a virtual directory in the IIS Manager named
"quickstart". You must then create a subdirectory named "bin". Compile the two C# files
into quickstart.dll, and copy that DLL into the bin directory.
Tried it again changing the method="post" to method="get" and it worked as expected... was able to use input boxes to pass arguments. URL is (http://www.coldfusionportal.org/flex3cf/xmlHttpService.cfm), and apparently changing the method from post to get sent the parameters through as URL parameters, which is what the xmlHttpService.cfm file was looking for as the argument collection.
This allows you to keep your METHOD=POST if you prefer sending params through the forms scope instead of through URL. This works without wrapping your input with FORM tags as well, though I tried with wrapping FORM tags around the input and it works either way. I actually prefer the form wrap as you can then customize that UI component's color, position, etc. Let me know if this works for you!
"Compile the two C# files into quickstart.dll, and copy that DLL into the bin directory"
Actually, there is an easier way. Create an App_Code directory, and drop the two .cs files in there--ASP.NET will compile them on the fly, and there's no need to generate a DLL to drop in the Bin directory.
Well,
Copy the 2nd example, Category2, into my computer, it runs normal.
But when run the first example,the browser show only "NULL",just like a panel.
What's wrong?
I try this example with java files. On my computer i have tomcat+blazeds. I put .java files into .../webapps/blazeds/WEB-INF/classes/quickstart folder and xmlHttpService.jsp into .../webapps/blazeds/WEB-INF folder. In tag <mx:HTTPService... i write url="http://localhost:8080/xmlHttpService.jsp"
and when i run my flex application click on "Get Shipping Options" gives me Alert window "Error request HTTP"
what's the reason? may be i've put files into wrong folders or smth else?
I'm very new to Flex and I was wondering why in almost every example I see a mixing of ActionScript with the MXML. I am a big fan of the MVC approach to programming, and these tutorials don't do the best job of reinforcing such practices.
I was wondering, is it even possible to declare the HTTPService in ActionScript, or is this something that can only be declared in an MXML file?
My preferred way would be to leave the MXML for just the layout and design, and put all of the application logic, including all event handlers, in separate files. Is this a common strategy used by Flex developers?