ExtJs6.0之File上傳組件

文件上傳框的創建方式

• 創建Panel，添加文件上傳組件

var uploadForm =Ext.create('Ext.form.Panel', {
    //renderTo:'uploadForm',
    items: [
        Ext.create('Ext.form.field.File', {
            fieldLabel:'附件',
            labelAlign:'right',
            msgTarget:'side',
            name:'file',
            width:"70%",
            padding:'5',
            renderTo:'file',
            allowBlank:false,
            buttonText:'請上傳附件',
            listeners:{
                'change':function() {
                    var uploadUrl = basePath + 'web/upfile/upfile-web!upload';
                    Ext.Ajax.request({
                        url : uploadUrl,
                        method : 'POST',
                        form : 'uploadForm',
                        success : function(response) {
                            var json = Ext.decode(response.responseText);
                            //console.log('json', json);
                            //attrFileId.setValue(json.id[0]);
                            attrId=json.id[0];
                        }
                    });
                },
            }
        }),
    ],
});

• 直接創建

var attrD = Ext.create('Ext.form.field.File',{
    fieldLabel:'拌合站檢定證書',
    name: 'file',
    labelWidth: 130,
    msgTarget: 'side',
    width:"80%",
    allowBlank: false,
    anchor: '100%',
    buttonText: '請選擇附件',
    labelAlign:'right',
    renderTo:'attrDIdDiv',
    value:attrDName,
    listeners:{
        'change':{
            fn:function(){
                submitFrom('D');
            }
        }
    }
});