ExtJs 4.1以Ajax方式上傳文件

我有一個要求，我需要使用ExtJs以ajax方式上傳文件。我的表單已經有許多其他字段，如文本，textarea等。我已經在父表單中的單獨表單中包含了我的文件。此外，該表單還有一個上載按鈕，可在點擊該按鈕時執行功能。在該按鈕處理程序中，我提交包含文件字段的表單。它的工作就像一個魅力。唯一的問題是頁面會刷新。我不想那樣。我需要以ajax的方式做這個上傳。ExtJs 4.1以Ajax方式上傳文件

使用ExtJs可以嗎？我知道我們可以通過將表單目標設置爲iframe來使用純html/javascript，從而輕鬆防止頁面刷新。

我們有這樣的解決方案嗎？

請大家給一些思路或解決這個問題

這是我的代碼片段：

{ 
      xtype: 'form',     
      items: [ 
       { 
        xtype: 'filefield', 
        name: 'file', 
        fieldLabel: '<b>Presentation</b>', 
        msgTarget: 'side', 
        labelAlign: 'top', 
        width: 300, 
        allowBlank : true, 
        id: 'file', 

        buttonCfg: { 
        text: '', 
        iconCls: 'upload-icon' 
       } 
       }, 
       { 
        xtype: 'panel', 
        id: 'selectdFileName', 
        html: '<b>' + presenationFile + '</b>' 
       }, 
       { 
        xtype: 'panel', 
        html: '<br/>' 
       }, 
       { 
        xtype: 'button', 
        text: 'Upload', 
        handler: function() { 
        var form = this.up('form').getForm(); 
        form.target = 'upload_target'; 
        if (form.isValid()) { 
         form.submit({ 
         url: contextPath + '/app/uploadFile', 
         params: { 
          id: formId 
         }, 
         waitMsg: 'Uploading presentation...', 
         success: function(form, action) { 
          var respJson = Ext.JSON 
            .decode(action.response.responseText); 
          Ext.getCmp('selectdFileName').update(
            "<b>" + respJson.path + "</b>"); 
         } 
         }); 
        } 
        } 
       }] 

      }

在上面的代碼中，有可能會對其他領域的另一種形式是圍繞這種形式。

讓我知道這是否讓你更好地理解我的問題。

來源

2013-08-01 RageshAK

你能發表一些代碼嗎？我這樣做的方法，但我從來沒有看到刷新頁面。你使用Ext JS MVC，還是你在做其他事情？ – existdissolve

在你的上傳按鈕，我會嘗試這樣的：

//store the vals 
var vals = form.getValues(); 

//then, in form.submit... 

form.submit({ 
    params: { 
     values: vals 
    } 
});

JSON的應處理爲您的所有對象轉換（所以你必須與你的丘壑的不同領域的一個「值」對象對象（eg：name：'frank'，id：'19381'etc ..））

來源

2013-08-02 14:45:49 FuriousFolder

ExtJs 4.1以Ajax方式上傳文件

回答

相關問題