ExtJS:MessageBox未阻止上载

zpf6vheq  于 2022-11-05  发布在  其他
关注(0)|答案(2)|浏览(151)

我有一个表单,其中的文件字段必须在大小限制之内。如果已经达到限制,用户可以选择是否允许该文件。“取消”将取消上载。
函数checkFile检查文件的大小,函数uploadFile上传checkFile结果的文件:

checkFile : function(file){
    var result = /.pdf$/i.test(file.name);
    var fileOk;
    var maxSizeMo = this.MAX_SIZE / (1024*1024);
    var cancelUpload;

    if (result) {
        if (file.size < this.ALERTE_SIZE) {
            fileOk= true;
        } else if (file.size > this.ALERTE_SIZE && file.size < this.MAX_SIZE) {
            fileOk = true;

            Ext.MessageBox.show({
                title: 'Warning',
                msg: 'Some msg',
                width: 330,
                buttons: Ext.MessageBox.OKCANCEL,
                icon: Ext.MessageBox.WARNING,
                closable: false,
                fn: function(btn){
                    if(btn!='ok'){
                        cancelUpload = true;
                    } else { 
                        cancelUpload = false;
                        return;
                    }
                }
            });

        } else {
            fileOk = false;
            cancelUpload = true;
        }
    } else {
        fileOk = false;
        cancelUpload = true;
    }
    return {isTestOk : fileOk, isCancelled : cancelUpload};
},

以及

uploadFile : function(fileField, value, eOpts){
    var file = fileField.fileInputEl.dom.files[0];
    var resultCheck = this.checkFile(file);

    if(resultCheck.isTestOk){
        if(!resultCheck.isCancelled){
            this.loadMask.show();
            app.FileUploader.uploadFile(file, this, function(success, fileName, fileReference, exception){
                try {
                    if(success === true){
                        var recordConfig = [{label : fileName, value : fileReference, supprimer : false, context : null}];
                        this.addPJAndSelect(recordConfig);
                        fileField.reset();
                    }else if(exception){
                    }
                }finally{
                    this.loadMask.hide();
                }
            });
        } else {
            PopupHelper.alerte("Upload cancelled by the user");
        }
    }
},

messageBox不阻止上传,也不等待用户的回答,怎么可能等待点击按钮呢?

lh80um4z

lh80um4z1#

MessageBox是异步的。您可以使用回呼,例如:

...
...
    checkFile: function (file, successCallBack, successCallBackScope) {
        var result = /.pdf$/i.test(file.name);
        var fileOk;
        var maxSizeMo = this.MAX_SIZE / (1024 * 1024);
        var cancelUpload;

        if (result) {
            if (file.size < this.ALERTE_SIZE) {
                fileOk = true;
            } else if (file.size > this.ALERTE_SIZE && file.size < this.MAX_SIZE) {
                fileOk = true;

                Ext.MessageBox.show({
                    title: 'Warning',
                    msg: 'Some msg',
                    width: 330,
                    buttons: Ext.MessageBox.OKCANCEL,
                    icon: Ext.MessageBox.WARNING,
                    closable: false,
                    fn: function (btn) {
                        if (btn != 'ok') {
                            successCallBack.call(successCallBackScope); 
                        } else {
                            cancelUpload = false;
                            return;
                        }
                    }
                });

            } else {
                fileOk = false;
                cancelUpload = true;
            }
        } else {
            fileOk = false;
            cancelUpload = true;
        }
        return {
            isTestOk: fileOk,
            isCancelled: cancelUpload
        };
    },
    uploadFile: function (fileField, value, eOpts) {
        var file = fileField.fileInputEl.dom.files[0];
        var resultCheck = this.checkFile(file, this.successCallBack, this);

        if (resultCheck.isTestOk) {
            if (!resultCheck.isCancelled) {} else {
                PopupHelper.alerte("Upload cancelled by the user");
            }
        }
    },

    successCallBack: function () {
        this.loadMask.show();
        app.FileUploader.uploadFile(file, this, function (success, fileName, fileReference, exception) {
            try {
                if (success === true) {
                    var recordConfig = [{
                        label: fileName,
                        value: fileReference,
                        supprimer: false,
                        context: null
                    }];
                    this.addPJAndSelect(recordConfig);
                    fileField.reset();
                } else if (exception) {}
            } finally {
                this.loadMask.hide();
            }
        });

    }
...
...

代码不可用..

olhwl3o2

olhwl3o22#

如果你使用async/await,你可以创建自己的异步方法并等待它。下面是一个示例实现。

Ext.override(Ext.window.MessageBox, {
  showAsync: function(config) {
    var me = this;
    var deferred = Ext.create('Ext.Deferred');
    me.show(config);
    /* We're overriding the userCallback below, but we want to
     * restore it after we're done, in case we decide to not use
     * showAsync next time */
    var frameworkCallback = me.userCallback;
    me.userCallback = function(buttonId, value, cfg) {
      // Restore framework's callback
      me.userCallback = frameworkCallback;
      deferred.resolve({
        buttonId: buttonId,
        value: value,
        cfg: cfg
      });
    };
    return deferred;
  }
});

相关问题