extJS中的文件上傳隱藏文本字段

Question

我將extJS4用於我的GUI，因此也顯示了文件上傳對話框。 最后，我只想有一個按鈕，當我單擊它時，它會顯示文件上傳對話框，而當我在其中選擇內容時，它會自動上傳文件。

對於自動“提交”，我知道我必須為文件上傳對話框的onChange事件編寫一個處理程序。 因此，這不是問題。 但是有沒有一種方法可以禁用文本字段而不必訴諸CSS？ （當我選擇一個要上傳的文件時，名稱將被寫入到文本字段中。...並且我想消除該文本字段或至少使其不可見）。

Answer 1

您搜索的屬性是buttonOnly: true

在這里找到文檔

只需將其添加到示例中，如下所示：

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

    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.');
                    }
                });
            }
        }
    }]
});