學習筆記 Flex如何結合JSP

作者：sony 2010-08-10 16:41:54

本文向大家介紹一下Flex結合JSP的概念，其實Flex里夾雜了ajax異步調用的技術，因為本身ACTIONSCRIPT就和JAVASCRIPT有著異曲同工之妙。

在學習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).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>

以上代碼就是創建分別叫題目和路徑的2個列，title和url即為遍歷出來的信息源標簽。

(3).click="navigateToURL(newURLRequest(dgPosts.selectedItem.url));"linkbutton的屬性，強調一點的是dgPosts是datagrid中所產生的選項，而navigateToURL（newURLRequest（url））此句就是另外打開一個url。

【編輯推薦】

學習筆記 Flex應用程序如何啟動
FlexBuilder4十大新特性閃亮登場
學習總結在Flex中如何嵌入Flex字體
揭開Flex正則表達式的神秘面紗
技術前沿如何在Flex中嵌入完整HTML頁面

責任編輯：佚名來源： csdn.net

Flex JSP