在上一篇文章中,我们做了一个文件上传、导入组件,其实就是一个文件选择并上传的组件,该组件是基于Blazeds来实现的。本文利用该组件实现Flex客户端Txt文件的导入,并将导入的txt文本数据展现到Flex客户端的AdvancedDataGrid中,其它文件格式如excel等导入同理。
假设Txt文件内容如下,该文件没有抬头,分别表示用户ID、用户名称、用户IP。
103 胡宝强 192.168.12.44 10403 胡建平 192.168.67.192 10405 刘小强 192.168.17.102 10407 许云峰 192.168.28.22 |
上文中提到的组件中其文件导入方法为public function importFile(headers:Array):Boolean,该方法调用的是blazeds 服务的public Object[] importFile(byte[] content, List header, String fileType)方法,为此需要实现该方法。该方法核心就是txt文件的生成,txt文件的解析,代码如下:
public Object[] importFile(byte[] content, List header, String fileType)throws Exception{ Object[] result = new Object[0]; String pathname = "/usr/temp/temp01.txt"; //write file FileOutputStream stream = new FileOutputStream(file); stream.write(content); stream.close(); //read file result = parseTXT(header, pathname); file.delete(); return result; } private static Object[] parseTXT(List header, String filepath){ try{ FileReader reader = new FileReader(filepath); BufferedReader br = new BufferedReader(reader); String content = null; Map map = new HashMap(); List dataList = new ArrayList(); while((content = br.readLine()) != null) { String[] values = content.split("\t"); map = new HashMap(); for(int i=0; i<header.size(); i++){ if(i>=values.length){ map.put(header.get(i), null); }else{ map.put(header.get(i), values[i]); } } dataList.add(map); } br.close(); reader.close(); return dataList.toArray(); }catch(Exception e){ throw new AppException(e); } } |
客户端建立一个Flex Application,关键是使用文件导入组件,并将导入结果展示到表格中显示,代码如下:
<?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" xmlns:services="services.*" width="561" height="292" creationComplete="init()" xmlns:fileupload="fileupload.*"> <s:layout> <s:BasicLayout/> </s:layout>
<fx:Script> <![CDATA[ import mx.controls.Alert; import mx.rpc.events.FaultEvent; import mx.rpc.events.ResultEvent; import event.FileImportEvent; private var file:FileReference = new FileReference(); // protected function init():void{ file.addEventListener(Event.SELECT, selectHandler); file.addEventListener(Event.COMPLETE, completeHandler); }
private function completeHandler(event:Event):void { //trace("completeHandler: " + event); }
private function selectHandler(event:Event):void { this.txtFileInfo.text = file.name; this.txtFileInfo.toolTip = "文件大小: "+file.size/1000+ "K"; // file.load(); } // protected function btnImport_clickHandler(event:MouseEvent):void { if(StringUtil.isEmpty(txtFileInfo.text)){ Alert.show("请选择文件!"); return; } var data:ByteArray = file.data; var type:String = file.type; responder.token = ro.importFile(data,[ "user_id","login_name","login_ip"],type); }
protected function responder_resultHandler(event:ResultEvent):void { adg1.dataProvider = event.result; }
protected function responder_faultHandler(event:FaultEvent):void { Alert.show(event.fault.faultString); } ]]> </fx:Script>
<fx:Declarations> <s:RemoteObject id="ro" destination=" fileUpDownloadService" showBusyCursor="true"/> <s:CallResponder id="responder" result="responder_resultHandler(event)" fault="responder_faultHandler(event)"/> </fx:Declarations> <fileupload:FileImporter id="fileImporter" fileFilter="*.txt" x="10" y="30" fault="fileImporter_faultHandler(event)" result="fileImporter_resultHandler(event)"/> <s:Button id="btnImport" label="导入" x="435" y="10" click=" btnImport_clickHandler(event)"/>
<mx:AdvancedDataGrid id="adg1" x="14" y="75" width="537" height="207"> <mx:columns> <mx:AdvancedDataGridColumn dataField="user_id" headerText="员工号"/> <mx:AdvancedDataGridColumn dataField="login_name" headerText="用户登录名"/> <mx:AdvancedDataGridColumn dataField="login_ip" headerText="用户登录IP"/> </mx:columns> </mx:AdvancedDataGrid> </s:Application> |