学习笔记 Flex如何结合JSP-51CTO.COM

在学习Flex的过程中，你可能会遇到Flex和JSP结合的问题，这里和大家分享一下，其实Flex里夹杂了ajax异步调用的技术，因为本身ACTIONSCRIPT就和JAVASCRIPT有着异曲同工之妙。

Flex结合JSP

其实Flex里夹杂了ajax异步调用的技术，因为本身ACTIONSCRIPT就和JAVASCRIPT有着异曲同工之妙。我做了一个例子是参考手册上面的，不过自己改了一下，大概的程序就是这样的，首页当然是Flex服务器来解析hxml，然后后台通过jsp文件交互数据库，然后把数据动态的封装成xml格式，最后在把xml标签与Flex程序绑定在一起，就可以了。这样当运行Flex前端程序的时候，后台就会把绑定好的数据显示到了Flex的组件里。

我的mxml代码：

<?xmlversionxmlversion="1.0"encoding="utf-8"?> 
<mx:Applicationxmlns:mxmx:Applicationxmlns:mx="http://www.adobe.com/2006/mxml" 
layout="absolute"creationComplete="feedRequest.send()"backgroundGradientColors="[#000000,#000000]"> 
<mx:HTTPServiceidmx:HTTPServiceid="feedRequest"url="http://localhost:8080/test/index.jsp"useProxy="false"> 
<mx:requestxmlnsmx:requestxmlns=""> 
<directory>{test.text}</directory> 
</mx:request> 
</mx:HTTPService> 
<mx:Panelidmx:Panelid="blog"width="359"height="520" 
title="{feedRequest.lastResult.rss.channel.title}"verticalCenter="188.5"horizontalCenter="179"> 
<mx:DataGrididmx:DataGridid="dgPosts"dataProvider="{feedRequest.  
lastResult.rss.channel.item}"width="340"height="167"> 
<mx:columns> 
<mx:DataGridColumnheaderTextmx:DataGridColumnheaderText="题目"dataField="title"/> 
<mx:DataGridColumnheaderTextmx:DataGridColumnheaderText="路径"dataField="url"/> 
</mx:columns> 
</mx:DataGrid> 
<mx:TextAreawidthmx:TextAreawidth="388"height="129"  
htmlText="{dgPosts.selectedItem.description}"/> 
<mx:LinkButtonlabelmx:LinkButtonlabel="查看详细"click="navigateToURL(newURLRequest(dgPosts.selectedItem.url));"/> 
<mx:Labeltextmx:Labeltext="选择ID号"/> 
<mx:TextInputidmx:TextInputid="test"width="115"height="23"/> 
<mx:Labeltextmx:Labeltext="{test.text}"/> 
<mx:Buttonlabelmx:Buttonlabel="登陆"id="Submit"click="feedRequest.  
send();"/> 
</mx:Panel> 
<mx:Imagewidthmx:Imagewidth="717"height="151"top="31" 
horizontalCenter="0"> 
<mx:source>file:///C|/DocumentsandSettings/Administrator/桌面/banner.gif</mx:source> 
</mx:Image> 
<mx:MenuBarxmx:MenuBarx="188"y="203"width="539"height="45"> 
</mx:MenuBar> 
</mx:Application> 
 
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.

注释：

(1).application里creationComplete="feedRequest.send()"这一属性是每次程序运行时，调用httpservice里的Send（）方法，在这个程序里实际上是请求http://localhost:8080/test/index.jsp，把得到的数据以xml形式返回，把内容绑定到DataGrid的组件上。

(2).dataProvider="{feedRequest.lastResult.rss.channel.item}"此句的语法，应该是，得到最后的返回结果，按照rss，channel，item此三层标签去绑定所遍历的数据。

<mx:columns> 
<mx:DataGridColumnheaderTextmx:DataGridColumnheaderText="题目"dataField="title"/> 
<mx:DataGridColumnheaderTextmx:DataGridColumnheaderText="路径"dataField="url"/> 
</mx:columns> 
1.
2.
3.
4.

以上代码就是创建分别叫题目和路径的2个列，title和url即为遍历出来的信息源标签。

(3).click="navigateToURL(newURLRequest(dgPosts.selectedItem.url));"linkbutton的属性，强调一点的是dgPosts是datagrid中所产生的选项，而navigateToURL（newURLRequest（url））此句就是另外打开一个url。

【编辑推荐】