我正在尝试使用Ext JS表单上传文件,并在成功或失败的情况下显示适当的消息.但是我不能得到所需的结果.我无法在form.submit操作中使成功或失败的回调工作.
现在我所做的是：
使用此脚本创建表单：
new Ext.FormPanel({
fileUpload: true,frame: true,url: '/profiler/certificate/update',success: function() {
console.log(arguments);
},failure: function() {
console.log(arguments);
}
}).getForm().submit()
/*
The response Content-Type is text/html (with charcode=utf8);
The response JSON is: { "success": true }
*/
将内容类型的响应设置为基于this answer的text / html.
基于Ext JS docs发送适当的JSON结果.通过Fiddler捕获的响应是：
{"success":false}
要么
{"success":true}
我甚至将Content-Type的响应设置为application / json.但还是没有成功.
我已经阅读过链接,如this和this,但没有一个帮助.请注意,我还尝试了另一个创建表单的脚本,其中包含一个上传字段和一个保存按钮,并将表单提交到保存按钮的处理程序中.但仍然没有回调被触发.
解决方法
这是一个工作示例 – Javascript代码：
Ext.onReady(function () {
Ext.define('ImagePanel',{
extend: 'Ext.form.Panel',fileUpload: true,title: 'Upload Panel',width: 300,height: 100,onUpload: function () {
this.getForm().submit({
url: 'upload.PHP',scope: this,success: function (formPanel,action) {
var data = Ext.decode(action.response.responseText);
alert("Success: " + data.msg);
},failure: function (formPanel,action) {
var data = Ext.decode(action.response.responseText);
alert("Failure: " + data.msg);
}
});
},initComponent: function () {
var config = {
items: [
{
xtype: 'fileuploadfield',buttonText: 'Upload',name: 'uploadedFile',listeners: {
'change': {
scope: this,fn: function (field,e) {
this.onUpload();
}
}
}
}
]
};
Ext.apply(this,Ext.apply(this.initialConfig,config));
this.callParent(arguments);
}
});
var panel = Ext.create('ImagePanel',{
renderTo: Ext.getBody()
});
});
<?PHP if (isset($_FILES)) { $temp_file_name = $_FILES['uploadedFile']['tmp_name']; $original_file_name = $_FILES['uploadedFile']['name']; echo '{"success": true,"msg": "'.$original_file_name.'"}'; } else { echo '{"success": false,"msg": "No Files"}'; }
