ExtJS教程----自定义下载组件

自定义下载组件

Ext.define('ExtJS5Example.view.FileDownloader', {
    extend: 'Ext.Component',
    alias: 'widget.FileDownloader',
    autoEl: {
        tag: 'iframe',
        cls: 'x-hidden',
        src: Ext.SSL_SECURE_URL
    },
    stateful: false,
    load: function (config) {
        var e = this.getEl();
        var location = config.url + (config.params ? '?' + Ext.urlEncode(config.params) : '');
        Ext.Msg.show({
            msg: '努力下载中,请等待...',
            progress: true,
            closable: false,
            wait: true,
            waitConfig: { interval: 200 }
        });
        // || Ext.isChrome
        if (Ext.isIE9 || Ext.isIE8 || Ext.isIE7) {
            e.dom.contentWindow.location.href = location;
            e.dom.onreadystatechange = function () {
                Ext.MessageBox.hide();
                if (e.dom.readyState == 'complete') {
                    if (e.dom.attachEvent) {
                        e.dom.attachEvent('onload', function () {
                            Ext.Msg.show({
                                title: 'Attachment missing',
                                msg: 'The document can not be found on the server.',
                                buttons: Ext.Msg.OK,
                                icon: Ext.MessageBox.ERROR
                            })
                        });
                    }
                }
            };
        } else {
            e.dom.async = false;
            e.dom.src = location;
            Ext.Msg.close();
            e.dom.load = function () {
                if (e.dom.contentDocument.body.childNodes[0].wholeText == '404') {
                    Ext.Msg.show({
                        title: 'Attachment missing',
                        msg: 'The document you are after can not be found on the server.',
                        buttons: Ext.Msg.OK,
                        icon: Ext.MessageBox.ERROR
                    })
                }
                if (e.dom.contentDocument.body.childNodes[0].wholeText == 'undefined') {
                    Ext.Msg.show({
                        title: 'Failed to download',
                        msg: 'The document you are after can not be downloaded.',
                        buttons: Ext.Msg.OK,
                        icon: Ext.MessageBox.ERROR
                    })
                }
            }
        }
    }
});

2.引用:

        var downloader = Ext.getCmp('FileDownloader')
        downloader.load({
            url: '/Student/StudentReportCard',
            waitMsg: '模板下载中...',
            params: { studentId: studentId },
            failure: function (response, options) {
                Ext.Msg.alert('提示', Ext.JSON.decode(response.responseText)["message"]);
            }
        });