当前位置: 代码迷 >> Web前端 >> Ext.ux.UploadDialog.Dialog Ext下传
  详细解决方案

Ext.ux.UploadDialog.Dialog Ext下传

热度:246   发布时间:2012-08-25 10:06:20.0
Ext.ux.UploadDialog.Dialog Ext上传
今天做项目做了个上传的功能,不过遇到好多问题,先在这做个笔记。。。。

先引入
Java代码 复制代码?收藏代码
  1. ???<link?rel="stylesheet"?type="text/css"?href="<%=path?%>/css/ext-all.css"?/> ??
  2. <!--?GC?--> ??
  3. <!--?LIBS?--> ??
  4. <script?type="text/javascript"?src="<%=path?%>/js/ext-base.js"></script> ??
  5. <!--?ENDLIBS?--> ??
  6. <script?type="text/javascript"?src="<%=path?%>/js/ext-all.js"></script> ??
  7. <script?type="text/javascript"?src="<%=path?%>/js/ext-lang-zh_CN.js"></script> ??
  8. ???? ??
  9. <script?type="text/javascript"?src="<%=path?%>/js/UploadDialog/Ext.ux.UploadDialog.js"></script> ??
  10. ???? ??
  11. <script?type="text/javascript"?src="<%=path?%>/js/UploadDialog/Ext.ux.UploadDialog.packed.js"></script>??
    <link rel="stylesheet" type="text/css" href="<%=path %>/css/ext-all.css" />
	<!-- GC -->
	<!-- LIBS -->
	<script type="text/javascript" src="<%=path %>/js/ext-base.js"></script>
	<!-- ENDLIBS -->
	<script type="text/javascript" src="<%=path %>/js/ext-all.js"></script>
	<script type="text/javascript" src="<%=path %>/js/ext-lang-zh_CN.js"></script>
		
	<script type="text/javascript" src="<%=path %>/js/UploadDialog/Ext.ux.UploadDialog.js"></script>
		
	<script type="text/javascript" src="<%=path %>/js/UploadDialog/Ext.ux.UploadDialog.packed.js"></script>


Ext代码:
Java代码 复制代码?收藏代码
  1. ???/** ?
  2. ????*?文件上传 ?
  3. ????*/??
  4. ???function?insertImages()? ??
  5. {? ??
  6. ????var?editId=Ext.getCmp('queId').getValue(); ??
  7. ????//alert('../files.do?method=addFile&type=ntc&tmpId='+useId+'&isupdate='+isupdate+'&editId='+editId); ??
  8. ????dialog?=?new?Ext.ux.UploadDialog.Dialog({? ??
  9. ??????????title:?'文件上传',?? ??
  10. ??????????url:paths+'/files.do?method=addFile&type=que&tmpId='+useId+'&isupdate='+isupdate+'&editId='+editId,?? ??
  11. ??????????width?:?450,? ??
  12. ??????????height?:?300,? ??
  13. ??????????minWidth?:?450,? ??
  14. ??????????minHeight?:?300,? ??
  15. ??????????draggable?:?true,? ??
  16. ??????????resizable?:?true,? ??
  17. ??????????//autoCreate:?true,???? ??
  18. ??????????constraintoviewport:?true,?? ??
  19. ??????????permitted_extensions:['ZIP','zip','DOC','doc','XLS','xls','TXT','txt','RAR','rar','JPG','jpg','GIF','gif','PNG','png'],???? ??
  20. ??????????modal:?true,? ??
  21. ??????????//post_var_name:?'mms',? ??
  22. ??????????post_var_name:?'upload',? ??
  23. ??????????reset_on_hide:?false,?? ??
  24. ??????????allow_close_on_upload:?true,???//关闭上传窗口是否仍然上传文件? ??
  25. ??????????upload_autostart:?true??? ??
  26. ????});? ??
  27. ????dialog.show();//'show-button'? ??
  28. ????dialog.on('uploadsuccess',?onUploadSuccess);? ??
  29. }? ??
  30. ??
  31. ??
  32. function?onUploadSuccess(dialog,?filename,?resp_data,?record){??? ??
  33. ????????????????var?queId=''; ??
  34. ????????????????if(isupdate==1) ??
  35. ????????????????????queId=useId; ??
  36. ????????????????if(isupdate==2) ??
  37. ????????????????????queId=Ext.getCmp('queId').getValue(); ??
  38. ????????????????fileDs.load({ ??
  39. ????????????????????params:?{ ??
  40. ????????????????????????findId:?queId, ??
  41. ????????????????????????type:'que', ??
  42. ????????????????????????isupdate:isupdate ??
  43. ????????????????????????????} ??
  44. ????????????????}); ??
  45. }??
    /**
     * 文件上传
     */
    function insertImages() 
	{ 
		var editId=Ext.getCmp('queId').getValue();
		//alert('../files.do?method=addFile&type=ntc&tmpId='+useId+'&isupdate='+isupdate+'&editId='+editId);
    	dialog = new Ext.ux.UploadDialog.Dialog({ 
	          title: '文件上传',  
	          url:paths+'/files.do?method=addFile&type=que&tmpId='+useId+'&isupdate='+isupdate+'&editId='+editId,  
	          width : 450, 
	          height : 300, 
	          minWidth : 450, 
	          minHeight : 300, 
	          draggable : true, 
	          resizable : true, 
	          //autoCreate: true,    
	          constraintoviewport: true,  
	          permitted_extensions:['ZIP','zip','DOC','doc','XLS','xls','TXT','txt','RAR','rar','JPG','jpg','GIF','gif','PNG','png'],    
	          modal: true, 
	          //post_var_name: 'mms', 
	          post_var_name: 'upload', 
	          reset_on_hide: false,  
	          allow_close_on_upload: true,   //关闭上传窗口是否仍然上传文件 
	          upload_autostart: true   
	    }); 
    	dialog.show();//'show-button' 
    	dialog.on('uploadsuccess', onUploadSuccess); 
	} 


	function onUploadSuccess(dialog, filename, resp_data, record){   
	  				var queId='';
					if(isupdate==1)
						queId=useId;
					if(isupdate==2)
						queId=Ext.getCmp('queId').getValue();
					fileDs.load({
						params: {
							findId: queId,
							type:'que',
							isupdate:isupdate
								}
					});
	}


Ext.ux.UploadDialog中的其它事件函数[转载自http://wayfoon.iteye.com/blog/432541]
??? * filetest - fires before file is added into the queue, parameters:
????? dialog - reference to dialog
????? filename - file name
????? If handler returns false then file will not be queued.
??? * fileadd - fires when file is added into the queue, parameters:
????? dialog - reference to dialog
????? filename - file name
??? * fileremove - fires when file is removed from the queue, parameters:
????? dialog - reference to dialog
????? filename - file name
????? record - file record
??? * resetqueue - fires when upload queue is resetted, parameters:
????? dialog - reference to dialog
??? * beforefileuploadstart - fires when file as about to start uploading:
????? dialog - reference to dialog
????? filename - uploaded file name
????? record - file record
????? If handler returns false then file upload will be canceled.
??? * fileuploadstart - fires when file has started uploading:
????? dialog - reference to dialog
????? filename - uploaded file name
????? record - file record
??? * uploadsuccess - fires when file is successfuly uploaded, parameters:
????? dialog - reference to dialog
????? filename - uploaded file name
????? data - js-object builded from json-data returned from upload handler response.
????? record - file record
??? * uploaderror - fires when file upload error occured, parameters:
????? dialog - reference to dialog
????? filename - uploaded file name
????? data - js-object builded from json-data returned from upload handler response.
????? record - file record
??? * uploadfailed - fires when file upload failed, parameters:
????? dialog - reference to dialog
????? filename - failed file name
????? record - file record
??? * uploadcanceled - fires when file upload canceled, parameters:
????? dialog - reference to dialog
????? filename - failed file name
????? record - file record
??? * uploadstart - fires when upload process starts, parameters:
????? dialog - reference to dialog
??? * uploadstop - fires when upload process stops, parameters:
????? dialog - reference to dialog
??? * uploadcomplete - fires when upload process complete (no files to upload left), parameters:
????? dialog - reference to dialog

  相关解决方案