[flex 4]使用组件与asp.net程序交互

    学习FLEX，数据交互部分是很重要的一部分，没有数据交互就写不出什么有价值的程序了。下面演示一个<mx:HTTPService>和http程序交互的例子。实现的功能是：flex客户端传递操作参数给ASP.NET程序，ASP.NET程序计算全部参数的和，并将结果返回flex程序并进行显示。

  1、首先编写asp.net程序，使用vs2008，新建asp.net网站，在自动生成的默认页面default.aspx页面中编写default.aspx.cs文件代码，default.aspx.cs是default.aspx的后台代码页，主要代码为以下部分,实现连加功能，并返回xml。

//default.aspx.cs

using System;

using System.Configuration;

using System.Data;

using System.Linq;

using System.Web;

using System.Web.Security;

using System.Web.UI;

using System.Web.UI.HtmlControls;

using System.Web.UI.WebControls;

using System.Web.UI.WebControls.WebParts;

using System.Xml.Linq;

public partial class _Default : System.Web.UI.Page

{

protected void Page_Load(object sender, EventArgs e)

{

int sum = 0;

string s = Request.QueryString["num"];

if (s != null)

{

string[] arr = s.Split(',');

foreach (string i in arr){

sum += Convert.ToInt32(i);

}

}

Response.Write("<ComputeResult>" + sum.ToString() + "</ComputeResult>");

}

}

2、将该网站发布到iis服务器中，例如该网站的地址为:http://127.0.0.1

3、编flex应用程序，源码如下。

<?xml version="1.0" encoding="utf-8"?>

<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"

xmlns:s="library://ns.adobe.com/flex/spark"

xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">

<fx:Declarations>

<!-- 将非可视元素（例如服务、值对象）放在此处 -->

<s:HTTPService id="httpser" showBusyCursor="true" result="httpHandle(event);" useProxy="false"/>

</fx:Declarations>

<fx:Script>

<!--[CDATA[

import mx.rpc.events.ResultEvent;

import mx.utils.StringUtil;

private var arr:Array=new Array();//定义数组，存放参数

private function httpHandle(e:ResultEvent):void{

lblResult.text=e.result.ComputeResult;

}

private function addHandle():void

{

httpser.url="http://127.0.0.1/default.aspx"; //将请求发送到刚刚建立的网站上。

if(arr.length>0){

httpser.url+="?";

}

for(var i:int=0;i<arr.length;i++){

if(i!=arr.length-1){

httpser.url+="num="+arr[i].para.toString()+"&";

}

else

httpser.url+="num="+arr[i].para.toString();

}

httpser.send();

}

private function addData():void{

if(mx.utils.StringUtil.trim(txtpara.text)!=null)

{

var obj:Object=new Object();

obj.para=txtpara.text;

arr.push(obj);

dg.dataProvider=arr;

txtpara.text="";

dg.validateNow();

}else

mx.controls.Alert.show("请正确输入","请正确输入");

}

private function delData():void{

arr=null;

dg.dataProvider=arr;

dg.validateNow();

}

]]-->

</fx:Script>

<s:Panel x="10" y="10" width="398" height="371" title="使用httpService交互">

<s:Label x="48" y="32" text="参数" width="29" height="18" fontSize="14"/>

<s:TextInput x="102" y="30" id="txtpara" width="195"/>

<mx:DataGrid id="dg" x="26" y="87" width="271">

<mx:columns>

<mx:DataGridColumn headerText="参数" dataField="para"/>

</mx:columns>

</mx:DataGrid>

<s:Button x="316" y="30" label="添加" click="addData();"/>

<s:Button x="316" y="87" label="清空" click="delData();"/>

<s:Label x="26" y="290" text="连加结果为" fontSize="14"/>

<s:Label x="122" y="290" id="lblResult" width="177"/>

<s:Button x="316" y="290" label="计算" click="addHandle();"/>

</s:Panel>

</s:Application>

4、运行程序查看效果如下图