由于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/