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方式上传文件

回答

相关问题