轉載:http://daoger.iteye.com/blog/205894
用actionscript給服務器請求添加參數難免會很麻煩,使用mx:request標籤就可以解決這一問題,可以把他
嵌套到HTTPService標籤中實現參數的提交。如下例所示:
- <mx:request>
- <txtPara>{txtPara.text}</txtPara>
- </mx:request>
<mx:request> <txtPara>{txtPara.text}</txtPara> </mx:request>
其中txtPara是發送到服務器端參數的名城,標籤體是參數值,而標籤體的值就是下方文本框的值。
以下是完整的mxml文件:
- <?xml version="1.0" encoding="utf-8"?>
- <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" >
- <mx:Script>
- <![CDATA[
- import mx.rpc.events.ResultEvent;
- import mx.controls.Alert;
- private function httpHandle(e:ResultEvent):void
- {
- Alert.show(e.result.Result);
- }
- ]]>
- </mx:Script>
- <mx:HTTPService id="myHttp" url="http://localhost:8080/myflex/http" showBusyCursor="true" result="httpHandle(event);" useProxy="false">
- <mx:request>
- <txtPara>{txtPara.text}</txtPara>
- </mx:request>
- </mx:HTTPService>
- <mx:Panel title="TEST HTTPService" width="368" height="140" x="78" y="30" layout="absolute">
- <mx:Label text="PARA" x="110" y="26"/>
- <mx:TextInput id="txtPara" x="161" y="24" width="95"/>
- <mx:Label text="The para sent to service is:" x="58" y="53"/>
- <mx:Label x="126" y="53" id="lblResult"/>
- <mx:Button label="Submit" click="myHttp.send()" x="277" y="53"/>
- </mx:Panel>
- </mx:Application>
<?xml version="1.0" encoding="utf-8"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" > <mx:Script> <![CDATA[ import mx.rpc.events.ResultEvent; import mx.controls.Alert; private function httpHandle(e:ResultEvent):void { Alert.show(e.result.Result); } ]]> </mx:Script> <mx:HTTPService id="myHttp" url="http://localhost:8080/myflex/http" showBusyCursor="true" result="httpHandle(event);" useProxy="false"> <mx:request> <txtPara>{txtPara.text}</txtPara> </mx:request> </mx:HTTPService> <mx:Panel title="TEST HTTPService" width="368" height="140" x="78" y="30" layout="absolute"> <mx:Label text="PARA" x="110" y="26"/> <mx:TextInput id="txtPara" x="161" y="24" width="95"/> <mx:Label text="The para sent to service is:" x="58" y="53"/> <mx:Label x="126" y="53" id="lblResult"/> <mx:Button label="Submit" click="myHttp.send()" x="277" y="53"/> </mx:Panel> </mx:Application>
在服務器端就可以從request中取到txtPara參數的值,這裏沒有做過多處理,只是在後端取到這個值又通過xml形式返還到客戶端。
這是例子運行的截圖:
mx:request組件一般是結合mx:form組件一起使用,flex提供了完備的數據校驗功能,如對字符串的校驗mx:StringValidator、
對電話號碼驗證的mx:PhoneNumberValidator、對日期驗證的mx:DateValidator、對電子郵件驗證的mx:EmailValidator、對郵編驗證
的mx:ZipCodeValidator等等。下面這個示例來自Flex的在線文檔,主要展示flex的form驗證功能,沒有數據的提交。
- <?xml version="1.0" encoding="utf-8"?>
- <!-- Simple example to demonstrate Form layout container. -->
- <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
- <mx:Panel title="Form Container Example" height="75%" width="75%"
- paddingTop="10" paddingLeft="10" paddingRight="10" paddingBottom="10">
- <mx:Text width="100%" color="blue"
- text="Moving from one form field to another triggers the validator."/>
- <mx:Form width="100%" height="100%">
- <mx:FormHeading label="Enter values into the form."/>
- <mx:FormItem label="First name">
- <mx:TextInput id="fname" width="200"/>
- </mx:FormItem>
- <mx:FormItem label="Date of birth (mm/dd/yyyy)">
- <mx:TextInput id="dob" width="200"/>
- </mx:FormItem>
- <mx:FormItem label="E-mail address">
- <mx:TextInput id="email" width="200"/>
- </mx:FormItem>
- <mx:FormItem label="Age">
- <mx:TextInput id="age" width="200"/>
- </mx:FormItem>
- <mx:FormItem label="SSN">
- <mx:TextInput id="ssn" width="200"/>
- </mx:FormItem>
- <mx:FormItem label="Zip">
- <mx:TextInput id="zip" width="200"/>
- </mx:FormItem>
- <mx:FormItem label="Phone">
- <mx:TextInput id="phone" width="200"/>
- </mx:FormItem>
- </mx:Form>
- </mx:Panel>
- <mx:StringValidator source="{fname}" property="text" minLength="4" maxLength="12"/>
- <mx:PhoneNumberValidator source="{phone}" property="text"/>
- <mx:DateValidator source="{dob}" property="text"/>
- <mx:EmailValidator source="{email}" property="text"/>
- <mx:NumberValidator source="{age}" property="text" integerError="Enter Integer value"
- minValue="18" maxValue="100" domain="int"/>
- <mx:SocialSecurityValidator source="{ssn}" property="text"/>
- <mx:ZipCodeValidator source="{zip}" property="text"/>
- </mx:Application>
<?xml version="1.0" encoding="utf-8"?> <!-- Simple example to demonstrate Form layout container. --> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"> <mx:Panel title="Form Container Example" height="75%" width="75%" paddingTop="10" paddingLeft="10" paddingRight="10" paddingBottom="10"> <mx:Text width="100%" color="blue" text="Moving from one form field to another triggers the validator."/> <mx:Form width="100%" height="100%"> <mx:FormHeading label="Enter values into the form."/> <mx:FormItem label="First name"> <mx:TextInput id="fname" width="200"/> </mx:FormItem> <mx:FormItem label="Date of birth (mm/dd/yyyy)"> <mx:TextInput id="dob" width="200"/> </mx:FormItem> <mx:FormItem label="E-mail address"> <mx:TextInput id="email" width="200"/> </mx:FormItem> <mx:FormItem label="Age"> <mx:TextInput id="age" width="200"/> </mx:FormItem> <mx:FormItem label="SSN"> <mx:TextInput id="ssn" width="200"/> </mx:FormItem> <mx:FormItem label="Zip"> <mx:TextInput id="zip" width="200"/> </mx:FormItem> <mx:FormItem label="Phone"> <mx:TextInput id="phone" width="200"/> </mx:FormItem> </mx:Form> </mx:Panel> <mx:StringValidator source="{fname}" property="text" minLength="4" maxLength="12"/> <mx:PhoneNumberValidator source="{phone}" property="text"/> <mx:DateValidator source="{dob}" property="text"/> <mx:EmailValidator source="{email}" property="text"/> <mx:NumberValidator source="{age}" property="text" integerError="Enter Integer value" minValue="18" maxValue="100" domain="int"/> <mx:SocialSecurityValidator source="{ssn}" property="text"/> <mx:ZipCodeValidator source="{zip}" property="text"/> </mx:Application>
示例運行的截圖:
其他一些入門例子可以參考:甘先生Blog http://www.blogjava.net/gump/articles/22859.html
更多問題請參考Flex的在線文檔:http://www.adobe.com/support/documentation/en/flex/