文件上传 – 为什么在extjs表单提交中没有调用成功回调？

发布时间：2020-12-14 18:52:33 所属栏目：资源来源：网络整理

导读：我正在尝试使用Ext JS表单上传文件,并在成功或失败的情况下显示适当的消息.但是我不能得到所需的结果.我无法在form.submit操作中使成功或失败的回调工作. 现在我所做的是：使用此脚本创建表单： new Ext.FormPanel({ fileUpload: true,frame: true,url: '/p

我正在尝试使用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代码：

<?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"}';
}

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!