Extjs之组件开发-uploadFile

//////////////////////////////////////////////////////////////// // 功能名称:文件上传组件 // 功能说明:对图片以及其他格式的文件上传至数据库中 // 使用方式:var filesUpload =new Euroa.component.FilesUpload(); // filesUpload.show(); // 创建时间:2010-03-12 //--------------------------- //////////////////////////////////////////////////////////////// Ext.BLANK_IMAGE_URL = 'EXT/resources/images/default/s.gif'; //function isImg(fileName) //{ // var extArray = new Array(".jpg", ".gif", ".bmp", ".png"); // var ext = fileName.slice(fileName.indexOf(".")).toLowerCase(); // for (var i = 0; i < extArray.length; i++) // { // if (extArray[i] == ext) // { // return true; // } // } // return false; //} Euroa.component.FilesUpload= Ext.extend ( Ext.Window, { initComponent: function() { // debugger; //alert(app.clientSideToken.UserId); var file_form = new Ext.form.FormPanel( { url:"Handler/Component/FilesUpload.aspx", height:450, width:450, labelWidth:80, labelAlign:"left", frame:true, fileUpload:true, defaults:{xtype:"field",width:350}, items:[ { xtype:"hidden", name:"userID", value:app.clientSideToken.UserId }, { id: 'imageUpload', name:'imageUpload', fieldLabel:"选择文件", inputType:"file" }, { xtype:"textfield", name:"fileName", allowBlank :false, blankText : "文件名称不能为空", value:name, fieldLabel:"文件名称" }, { xtype:"textarea", name:"description", fieldLabel:"文件描述" }, { id:'browseImage', fieldLabel:"图片预览", autoCreate: { width:350, height:350, tag: 'input', type: 'image', src: Ext.BLANK_IMAGE_URL, style:'filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale);' , id: 'imageBrowse' } }] }); var img_reg=//.([jJ][pP][gG]){1}$|/.([jJ][pP][eE][gG]){1}$|/.([gG][iI][fF]){1}$|/.([pP][nN][gG]){1}$|/.([bB][mM][pP]){1}$/; file_form.on('render',function(f) { file_form.form.findField('imageUpload').on('render',function() { Ext.get('imageUpload').on('change',function(field,newValue,oldValue ) { var url = 'file:///'+Ext.get('imageUpload').dom.value; //alert(url); if(img_reg.test(url)) { if(Ext.isIE7) { var image = Ext.get('imageBrowse').dom; image.src = Ext.BLANK_IMAGE_URL;//覆盖原来的图片 image.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src= url; } else { Ext.get('imageBrowse').dom.src = url; } } },this); },this); },this); Ext.apply(this, { id:"electron_add_win", title:'文件上传', layout:'fit', width:500, height:500, labelWidth:80, labelAlign:'right', // buttonAlign:'center', modal:true, resizable:false, frame:true, plain: true, buttonAlign:'right', animateTarget:document.body, animal:true, items:[file_form], buttons:[ { text:"上传", handler:function() { if(Ext.get('imageUpload').dom.value==''||Ext.get('imageUpload').dom.value == null) { Ext.Msg.alert('提示', '请选择一个文件进行上传!'); return; } if(file_form.form.isValid()) { Ext.MessageBox.show( { title: '请稍后', msg: '上传中...', progressText: '', width:300, progress:true, closable:false, animEl: 'loding' }); file_form.getForm().submit( { success: function(form, action) { Ext.Msg.alert('提示',action.result.msg); //win.hide(); }, failure: function() { Ext.Msg.alert('提示', '文件上传失败!'); } }) } } }, { text:"取消", handler:function() { this.close(); }, scope:this }] }); Euroa.component.FilesUpload.superclass.initComponent.apply(this, arguments); } } )

 

 

 

 后台代码 protected void Page_Load(object sender, EventArgs e) { string userID = Request.Form["userID"].ToString(); if(SaveFiles()) { Response.Write("{success:true,msg:'文件上传成功!'}"); } else { Response.Write("{success:true,msg:'文件上传失败!'}"); } } private bool SaveFiles() { ///'遍历File表单元素 HttpFileCollection files = HttpContext.Current.Request.Files; try { for (int iFile = 0; iFile < files.Count; iFile++) { ///'检查文件扩展名字 HttpPostedFile postedFile = files[iFile]; string fileName, fileExtension; fileName = System.IO.Path.GetFileName(postedFile.FileName); if (fileName != "") { fileExtension = System.IO.Path.GetExtension(fileName); ///注意:可能要修改你的文件夹的匿名写入权限。 //postedFile.SaveAs(System.Web.HttpContext.Current.Request.MapPath("../../TempFiles/") + fileName); //FileStream fs = new FileStream(System.Web.HttpContext.Current.Request.MapPath("../../TempFiles/") + fileName, FileMode.Open, FileAccess.Read); FileStream fs = new FileStream(postedFile.FileName, FileMode.Open, FileAccess.Read); Byte[] imgByte = new Byte[fs.Length]; fs.Read(imgByte, 0, imgByte.Length); fs.Close(); int i = fileExtension.Length - 1; //int start = i + 1; bean.CreatorId = userID; bean.Id = Guid.NewGuid().ToString(); bean.FileName = Request.Form["fileName"]; bean.FileFullName = fileName; bean.FileType = fileExtension.Substring(1, fileExtension.Length - 1); bean.FileLength = imgByte.Length / 1024; bean.Description = Request.Form["description"]; if(bean.FileType.ToLowerInvariant()=="jpg"||bean.FileType.ToLowerInvariant()=="gif"||bean.FileType.ToLowerInvariant()=="jpeg"||bean.FileType.ToLowerInvariant()=="png"||bean.FileType.ToLowerInvariant()=="bmp") { bean.IsImageFile = true; } else { bean.IsImageFile = false; } bean.FileContent = imgByte; bean.CreateTime = DateTime.Now; SysService.FrmFilesService.Save(bean); } } return true; } catch (Exception ex) { return false; } } }

你可能感兴趣的:(function,image,File,url,ExtJs,文件上传组件)