Javascript 以Ajax方式上传ExtJs 4.1文件

我需要使用ExtJs以ajax方式上传文件。我的表单已经有很多其他字段，如text、textarea等。我已经在父表单中的一个单独表单中包含了我的filefield。此外，该表单还有一个上载按钮，在单击该按钮时执行该功能。在该按钮处理程序中，我提交保存文件字段的表单。它工作起来很有魅力。唯一的问题是页面将被刷新。我不想那样。我需要以ajax的方式进行上传

使用ExtJs可以吗？我知道，当我们使用纯html/javascript时，通过将表单目标设置为iframe，可以很容易地防止页面刷新

我们有没有这样的解决办法

请给出一些解决这个问题的想法或方法

这是我的代码片段：

{
            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>");
                        }
                      });
                    }
                  }
                }]

          }

{
xtype:'表单'，
项目：[
{
xtype:'filefield'，
名称：'文件'，
fieldLabel:“演示文稿”，
msgTarget:'侧面'，
labelAlign:“顶部”，
宽度：300，
allowBlank：是的，
id:'文件'，
按钮FG：{
文本：“”，
iconCls:“上载图标”
}
},
{
xtype:'面板'，
id:“selectdFileName”，
html:“”+PresentationFile+“”
},
{
xtype:'面板'，
html:“
”
},
{
xtype:'按钮'，
文本：“上传”，
处理程序：函数（）{
var form=this.up（'form'）.getForm（）；
form.target='upload_target'；
if（form.isValid（））{
提交表格({
url:contextPath+'/app/uploadFile'，
参数：{
id:formId
},
waitMsg:'正在上载演示文稿…'，
成功：功能（形式、行动）{
var respJson=Ext.JSON
.decode（action.response.responseText）；
Ext.getCmp（'selectdFileName'）。更新(
“”+respJson.path+“”）；
}
});
}
}
}]
}

在上面的代码中，另一个带有may other字段的表单包含在该表单中

---

让我知道这是否能让您更好地了解我的问题。

在您的上传按钮中，我会尝试以下方法：

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

//then, in form.submit...

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

---

Json应该为您处理所有对象转换（因此您将有一个带有VAL对象不同字段的“值”对象（例如：name:'frank'，id:'19381'等））

您能发布一些代码吗？我做了一个类似这样的方法，但我从未见过页面刷新。您是在使用ExtJSMVC，还是在做其他事情？