由于ExtJs 4.1组件的严重麻烦,我从ExtJs 4.2移到了filefield。主要的麻烦是,在每次提交表单后,在ExtJs 4.1中都清除了文件字段。根据此thread的说法,在ExtJs 4.2中他们解决了此问题,尽管我将clearOnSubmit设置为false,但在我的应用程序中仍然面临同样的问题。我什至弄清楚是什么代码导致了整个问题:

 Ext.define('Ext.form.field.FileButton', {
     ...
 createFileInput : function(isTemporary) {
    var me = this;
    //ATTENTION!
    //before me.el.createChild is called
    //me.fileInputEl contains initial filefield:
    //<input id="filefield-2144-button-fileInputEl" class=" x-form-file-input" type="file" size="1" name="file_name" role="">
    me.fileInputEl = me.el.createChild({
        name: me.inputName,
        id: !isTemporary ? me.id + '-fileInputEl' : undefined,
        cls: me.inputCls,
        tag: 'input',
        type: 'file',
        size: 1
    });
    //ATTENTION!
    //now initial fielfield is gone, even though we have set clearOnSubmit to false
    me.fileInputEl.on('change', me.fireChange, me);
  }
...


表单提交到服务器并销毁初始元素时,有时会调用此库方法:

 <input id="filefield-2144-button-fileInputEl" class=" x-form-file-input" type="file" size="1" name="file_name" role="">


并将其替换为一个新的空的:

<input name="file_name" id="ext-gen4414" class="x-form-file-input" type="file" size="1">


因此,这有什么问题,以及如何解决此库错误。

最佳答案

我已经在4.2.1上对其进行了测试。其工作正常。提交后未清除文件字段。

Ext.application({
    name: 'Fiddle',

    launch: function() {
        Ext.create('Ext.form.Panel', {
            title: 'Upload a Photo',
            width: 400,
            bodyPadding: 10,
            frame: true,
            renderTo: Ext.getBody(),
            items: [{
                xtype: 'filefield',
                name: 'photo',
                fieldLabel: 'Photo',
                labelWidth: 50,
                msgTarget: 'side',
                allowBlank: false,
                anchor: '100%',
                buttonText: 'Select Photo...',
                clearOnSubmit: false
            }],

            buttons: [{
                text: 'Upload',
                handler: function() {
                    var form = this.up('form').getForm();
                    if (form.isValid()) {
                        form.submit({
                            url: 'photo-upload.php',
                            waitMsg: 'Uploading your photo...',
                            success: function(fp, o) {
                                Ext.Msg.alert('Success', 'Your photo "' + o.result.file + '" has been uploaded.');
                            }
                        });
                    }
                }
            }]
        });
    }
});

关于javascript - 清除clearOnSubmit为false的文件字段,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/39362007/

10-10 08:57