Extjs文件上傳進度

我在ExtJS4中看到了表單文件上傳的例子，我需要自定義文件上傳的進度。Extjs文件上傳進度

我看到waitMsg配置屬性，但我不想使用它，我不想使用extjs第三方插件。

那麼，我怎樣才能簡單地從上傳表單在extjs上傳進度？

來源

2013-01-21 xercool

waitMsg使用帶有無限自動更新進度欄的消息框。所以你不能只創建一個顯示當前上傳的進度條。

您可以創建自己的Ext.ProgressBar和估計值上傳時間和完成時間將其設置爲最大值。但我想你不想那樣。

回答你的問題：你不能只是跟蹤當前的上傳進度。

如果您確實需要此用戶體驗，您可以嘗試3rd party component。

引述文檔：使用正常的「Ajax」的技術，不進行

文件上傳，這是他們沒有使用XMLHttpRequest的執行。而是以標準方式提交的格式爲，DOM元素被臨時修改爲其目標集被設置爲指的是生成的，隱藏的，其被插入到文檔中，但在收集返回數據之後刪除。

來源

2013-01-21 14:22:49 A1rPun

我想extjs處理文件PUT請求和xhr必須返回字節發送...不是？ – xercool

http://stackoverflow.com/questions/76976/how-to-get-progress-from-xmlhttprequest關於這裏討論的XHR的這個問題。我怎樣才能從extjs獲得請求xhr對象？ – xercool

so .. that's bad（。謝謝 – xercool

buttons: [{ 
    text: 'Upload', 
    handler: function() { 
     var form = this.up('form').getForm(); 
     if (form.isValid()) { 
      form.submit({ 
       url: '/upload/file', 
       waitMsg: 'Uploading your file...', 
       success: function (f, a) { 
        var result = a.result, 
         data = result.data, 
         name = data.name, 
         size = data.size, 
         message = Ext.String.format('<b>Message:</b> {0}<br>' + 
          '<b>FileName:</b> {1}<br>' + 
          '<b>FileSize:</b> {2} bytes', 
          result.msg, name, size); 

        Ext.Msg.alert('Success', message); 
       }, 
       failure: function (f, a) { 
        Ext.Msg.alert('Failure', a.result.msg); 
       } 
      }); 
     } 
    } 
}]

現場演示，進度窗口是here

來源

2014-02-20 12:10:03 khmurach

爲了展示真正的進展，你可以使用onprogress的XMLHttpRequest的回調：

Ext.override(Ext.data.request.Ajax, { 
    openRequest: function (options) { 
     var xhr = this.callParent(arguments); 
     if (options.progress) { 
      xhr.upload.onprogress = options.progress; 
     } 
     return xhr; 
    } 
});

然後使用喜歡這裏：

Ext.Ajax.request({ 
    url: '/upload/files', 
    rawData: data, 
    headers: { 'Content-Type': null }, //to use content type of FormData 
    progress: function (e) { 
     console.log('progress', e.loaded/e.total); 
    } 
});

查看在線演示here。

來源

2017-06-28 19:38:39 khmurach

Extjs文件上傳進度

回答

相關問題