Extspringmvcファイルのダウンロード

extjsリストでのファイルのアップロードとダウンロード（名前変更操作あり）



File Upload Download Extjs List



転載アドレス：https：//www.cnblogs.com/xiaoqi123/p/8081915.html

extjsリストでのファイルのアップロードとダウンロードは次のとおりです。

図：



まず、アップロード



アップロードボタン：

 { xtype: 'button', width: 60, margin: '0 20', text: ' upload ', handler: 'onUploadClick' }]

アップロードボタンイベント（アップロードウィンドウを開き、パラメーターを渡します）：

画像 



 onUploadClick: function () { var me = this, view = me.getView(), vm = view.getViewModel(), store = me.getStore('gridstore'), filType = view.up('window').FIL_TYPE, / / ​​attachment type (1: project attachment, 2: demand attachment, 3 demand details attachment) fileId = view.up('window').FILE_RELATION_ID//attachment relationship ID (item table ID, requirement table ID, demand list ID) var userOper = Ext.create('MainApp.view.comm.UploadOperation.Operation') Ext.create('Ext.window.Window', { Title: 'Upload file', resizable: false, constrain: true, modal: true, items: userOper, width: 400, height: 120, _up: this, FIL_TYPE: filType, FILE_RELATION_ID:fileId, listeners: { beforeclose: function () { store.reload() } } }).show() },

画像

アップロードウィンドウ：

ウィンドウコードは、主にインポートボタンイベントを調べます。

バックグラウンドメソッドをアップロードします（GUIDの名前付けを再利用し、ファイルの重複が置き換えられないようにします。元の名前をデータベースに保存する必要があります）。

画像 

 /// /// upload files /// /// [HttpPost] public ActionResult UpLoadFile(string filType,string fileRelationId) { try { WFile wfile = new WFile() HttpPostedFileBase file = Request.Files[0] if (file == null) { Return Json(new { success = false, message = 'no file selected!', errors = new { fileUpName = 'Upload data error!' } }) } //if (!file.FileName.Contains('.doc') && !file.FileName.Contains('.docx')) //{ // return Json(new { success = false, message = 'The file format is incorrect, only Word files can be uploaded!', errors = new { fileUpName = 'Upload data error!' } }) //} string guId = Guid.NewGuid().ToString('N') string extension = Path.GetExtension(file.FileName) var filePath = Path.Combine(Request.MapPath('~/Upload'), Path.GetFileName(guId + extension)) file.SaveAs(filePath) / / Database operation wfile.FIL_TYPE = filType wfile.FILE_RELATION_ID = fileRelationId wfile.FIL_NAME = file.FileName wfile.FIL_PATH = guId + extension _wfile.Add(wfile) return Json(new { success = true, fileName = file.FileName, rowNum = 1 }) } catch (System.Exception ex) { Return Json(new { success = false, message = ex.Message, errors = new { fileUpName = 'Upload data error!' } }) } }

画像

次に、ダウンロード

ダウンロードボタン：

画像 

 columns: [ { dataIndex: 'NUMROW', text: 'serial number', width: 40 }, { dataIndex: 'FIL_NAME', text: 'attachment name', flex: 1 }, { dataIndex: 'FIL_PATH', header: 'file path', align: 'center', flex: 1, hidden: true }, { dataIndex: 'USER_NAME', text: 'creator', flex: 1 }, { Text: 'Upload time', dataIndex: 'CREATE_DATE', align: 'left', width: 125, flex: 1, renderer: Ext.util.Format.dateRenderer('Y-m-d') }, { Text: 'action', xtype: 'actioncolumn', width: 80, flex: 1, items: [ { icon: '../images/redactBtn_down.PNG', handler: 'DownFile' }, ] } ],

画像

ダウンロードボタンイベント：

 DownFile: function (grid, rowIndex, colIndex, e, td, tr) { window.location.href = '/DataBase/DownFile?fileName=' + tr.get('FIL_NAME') + '&filePathName=' + tr.get('FIL_PATH') }

バックグラウンドメソッドをダウンロードします（ダウンロードを完了するには、GUID名を元の添付ファイル名に置き換える必要があります）。

画像 

 /// /// Download attachments /// /// Original file name /// attachment address name /// public ActionResult DownFile(string fileName, string filePathName) { try { var filePath = Path.Combine(Request.MapPath('~/Upload'), Path.GetFileName(filePathName)) FileStream fs = new FileStream(filePath, FileMode.Open) byte[] bytes = new byte[(int)fs.Length] fs.Read(bytes, 0, bytes.Length) fs.Close() System.Web.HttpContext.Current.Response.ContentType = 'application/octet-stream' //Notify the browser to download the file instead of opening it System.Web.HttpContext.Current.Response.AddHeader('Content-Disposition', 'attachment filename=' + fileName) System.Web.HttpContext.Current.Response.BinaryWrite(bytes) System.Web.HttpContext.Current.Response.Flush() System.Web.HttpContext.Current.Response.End() return Json(new { success = true, fileName = fileName, rowNum = 1 }) } catch (System.Exception ex) { Return Json(new { success = false, message = ex.Message, errors = new { fileUpName = 'Upload data error!' } }) } }