【转】Working with JavaServer Pa…

Working with JavaServer Pages

You can use a Flex HTTPService component in conjunction with a JSP page and a SQL database management system to display the results of a database query in a Flex application and insert data into a database. You can call a JSP page with GET or POST to perform a database query. You can then format the query result data in an XML structure and return the XML structure to the Flex application in the HTTP response. When the result has been returned to the Flex application, you can display it in one or more user interface controls.

MXML code

The Flex application in the following example calls a JSP page that retrieves data from a SQL database. It formats database query results as XML and returns the XML to the Flex application, where it is bound to the dataProvider property of a DataGrid control and displayed in the DataGrid control.

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
    
    <mx:HTTPService id="srv" url="catalog.jsp"/>

    <mx:DataGrid dataProvider="{srv.lastResult.catalog.product}" width="100%" height="100%"/> 
    
    <mx:Button label="Get Data" click="srv.send()"/>
    
</mx:Application>

The HTTPService's send() method makes the call to the JSP page. This call is made in the click event of the Button in the MXML file.

The resultFormat property of the HTTPService component is set to object, so the data is sent back to the Flex application as a graph of ActionScript objects. This is the default value for the resultFormat property. Alternatively, you can use a result format of e4x to return data as an XMLList object on which you can perform ECMAScript for XML (E4X) operations. Switching the resultFormat property to e4x requires the following minor changes to the MXML code.

Note: If the result format is e4x , you do not include the root node of the XML structure in the dot notation when binding to the DataGrid.

The XML returned in this example contains no namespace information. For information about working with XML that does contain namespaces,

...
    <mx:HTTPService id="srv" url="catalog.jsp" resultFormat="e4x"/>
...
    <mx:DataGrid dataProvider="{srv.lastResult.product}" width="100%" height="100%"/>

When using the e4x result format, you can optionally bind the lastResult property to an XMLListCollection object and then bind that object to the DataGrid.dataProvider property:

...
    <mx:XMLListCollection id="xc"
         source="{userRequest.lastResult.product}"/>
          
    <mx:DataGrid id="dgUserRequest" x="22" y="128" dataProvider="{xc}">
...

JSP code

The following example shows the JSP page used in this application. This JSP page does not call a database directly. It gets its data from a Java class called ProductService, which in turn uses a Java class called Product to represent individual products.

<%@page import="flex.samples.product.ProductService, 
                flex.samples.product.Product, 
                java.util.List"%>
<?xml version="1.0" encoding="utf-8"?>
<catalog>
<%
    ProductService srv = new ProductService();
    List list = null;
    list = srv.getProducts();
    Product product;
    for (int i=0; i<list.size(); i++)
    {
        product = (Product) list.get(i);
%>    
<product productId="<%= product.getProductId()%>">
<name><%= product.getName() %></name>
<description><%= product.getDescription() %></description>
<price><%= product.getPrice() %></price>
<image><%= product.getImage() %></image>
<category><%= product.getCategory() %></category>
<qtyInStock><%= product.getQtyInStock() %></qtyInStock>
</product>
<%
    }
%>
</catalog>

Calling HTTP services in ActionScript

The following example shows an HTTP service call in an ActionScript script block. Calling the useHTTPService() method declares the service, sets the destination, sets up result and fault event listeners, and calls the service's send() method.

<?xml version="1.0"?>
<!-- fds\rpc\HttpServiceInAS.mxml. Compiles --> 
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" verticalGap="10">
    <mx:Script>
        <![CDATA[
            import mx.controls.Alert;
            import mx.rpc.http.HTTPService;
            import mx.rpc.events.ResultEvent;
            import mx.rpc.events.FaultEvent;
            
            private var service:HTTPService 

            public function useHttpService(parameters:Object):void {
                service = new HTTPService();
                service.destination = "sampleDestination";
                service.method = "POST";
                service.addEventListener("result", httpResult);
                service.addEventListener("fault", httpFault);
                service.send(parameters);
            }

            public function httpResult(event:ResultEvent):void {
                var result:Object = event.result;
            //Do something with the result.
            }

            public function httpFault(event:FaultEvent):void {
                var faultstring:String = event.fault.faultString;
                Alert.show(faultstring);
            }
        ]]>
    </mx:Script>
</mx:Application>

<script type="text/javascript" id="wumiiRelatedItems"> </script>