首先用.Net创建一个简单的WebService,连接的数据库是SqlServer2000的pubs数据库
[WebMethod (Description = "从数据库中获取人员信息")]
public DataTable getEmp()
{
string sql = "SELECT fname, lname, hire_date FROM dbo.employee";
this.sqlcomm.CommandText = sql;
DataTable table = new DataTable("Employ");
this.sqda.Fill(table);
return table;
}
创建一个Flex项目DataGridTest,创建项目的同时会创建一个DataGridTest.mxml文件从组件选项卡中拖一个DataGrid和一个Button组件,public DataTable getEmp()
{
string sql = "SELECT fname, lname, hire_date FROM dbo.employee";
this.sqlcomm.CommandText = sql;
DataTable table = new DataTable("Employ");
this.sqda.Fill(table);
return table;
}
我们还需要添加一个WebService组件,但是在选项卡中没有,所以切换到代码视图在文件中添加WebService组件
<mx:WebService id="webService1" useProxy="false" wsdl="http://localhost/FlexWebService/Service.asmx?WSDL" showBusyCursor="true" fault="Alert.show('通讯失败,请检查服务器是否存在','提示')">
<mx:operation name="getEmp">
</mx:operation>
</mx:WebService>
至于WebService组件的各个属性请参看FlexBuilder的帮助文件我这里就不多说了。<mx:operation name="getEmp">
</mx:operation>
</mx:WebService>
为button添加事件
<mx:Button x="303" y="446" label="按钮" fontWeight="bold" fontFamily="Arial" width="92" height="41" click="this.btn_click()"/>
<mx:Script>
<![CDATA[
import mx.controls.Alert;
private function btn_click():void
{
this.webService1.getEmp.send();
}
]]>
</mx:Script>
接下来是最重要的了!怎么把WebService的返回结果绑定到DataGrid上!<mx:Script>
<![CDATA[
import mx.controls.Alert;
private function btn_click():void
{
this.webService1.getEmp.send();
}
]]>
</mx:Script>
我是这样猜出来的
为 this.webService1.getEmp.send();设置一个断点,当点击了button后可以通过断点查看出返回结果的格式!然后我们就可以根据这个格式设置DataGrid的dataProvider属性了。如下图所示
可以看出返回结果集的格式:getEmp.lastResult.diffgram.DocumentElement.Employ;(当然我不是一次就看出来了,我试了好多次才试出来的)。那么DataGrid的dataProvider属性就应该是webService.getEmp.lastResult.diffgram.DocumentElement.Employ,在为DataGrid设置好headerText和dataField就可以了。下面是完整的代码
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<mx:Button x="303" y="446" label="按钮" fontWeight="bold" fontFamily="Arial" width="92" height="41" click="this.btn_click()"/>
<mx:Script>
<![CDATA[
import mx.controls.Alert;
private function btn_click():void
{
this.webService1.getEmp.send();
}
]]>
</mx:Script>
<mx:WebService id="webService1" useProxy="false" wsdl="http://localhost/FlexWebService/Service.asmx?WSDL" showBusyCursor="true" fault="Alert.show('通讯失败,请检查服务器是否存在','提示')">
<mx:operation name="getEmp">
</mx:operation>
</mx:WebService>
<mx:DataGrid id="dg1" x="42" y="31" width="643" height="385" dataProvider="{this.webService1.getEmp.lastResult.diffgram.DocumentElement.Employ}">
<mx:columns>
<mx:DataGridColumn headerText="First Name" dataField="fname"/>
<mx:DataGridColumn headerText="Last Name" dataField="lname"/>
<mx:DataGridColumn headerText="Hire Date" dataField="hire_date"/>
</mx:columns>
</mx:DataGrid>
</mx:Application>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
<mx:Button x="303" y="446" label="按钮" fontWeight="bold" fontFamily="Arial" width="92" height="41" click="this.btn_click()"/>
<mx:Script>
<![CDATA[
import mx.controls.Alert;
private function btn_click():void
{
this.webService1.getEmp.send();
}
]]>
</mx:Script>
<mx:WebService id="webService1" useProxy="false" wsdl="http://localhost/FlexWebService/Service.asmx?WSDL" showBusyCursor="true" fault="Alert.show('通讯失败,请检查服务器是否存在','提示')">
<mx:operation name="getEmp">
</mx:operation>
</mx:WebService>
<mx:DataGrid id="dg1" x="42" y="31" width="643" height="385" dataProvider="{this.webService1.getEmp.lastResult.diffgram.DocumentElement.Employ}">
<mx:columns>
<mx:DataGridColumn headerText="First Name" dataField="fname"/>
<mx:DataGridColumn headerText="Last Name" dataField="lname"/>
<mx:DataGridColumn headerText="Hire Date" dataField="hire_date"/>
</mx:columns>
</mx:DataGrid>
</mx:Application>
可能我的方法还不是最好的,但是毕竟比写一个方法来处理返回结果要省事多了,希望能够需要的人有所帮助,少走些弯路