Search code examples
javascriptphpextjsfpdf

ExtJS: Get file from Ajax post request response


I try to make a way to generate pdf files from my extjs application. When my export button is clicked this Ajax request is fired

Ext.Ajax.request({
    url: 'data/apppdf.php?class=Export&action=composerCSV',
    method: 'POST',
    timeout: 1200000,
    params: {
        id: id
    },

    success: function (response, opts) {
        // i don't know what to do here
    }
});

In my PHP file I make a pdf file using FPDF library like so

$pdf = new FPDF();
// fill my file
return $pdf->Output(null, "rapport" . date('Y-m-d_H:i:s'));

after the success of my request and the end of my script where the file is returned how do it make it available for user (how do i get the open / save popup, with a valid pdf file) ?


Solution

  • I usually use this approach, although there may exists better solution:

    • define browse window
    • generate PDF file on server
    • download and preview PDF file

    ExtJS part:

    Ext.define('Test.ReportWindow', {
        extend: 'Ext.window.Window',
    
        xfilename: '',
        xtitle: '',
    
        layout : 'fit',
        width: 1200,
        height: 800,
        maximizable: true,
    
        initComponent: function() {
            var me = this;
    
            me.callParent(arguments);
            me.title = me.xtitle;
            me.add(
                {
                xtype: "box",
                autoEl : {tag : "iframe", src : me.xfilename}
                }
            );
        }
    });
    
    Ext.onReady(function(){
    
        Ext.Ajax.request({
            url: 'data/apppdf.php?class=Export&action=composerCSV',
            method: 'POST',
            timeout: 1200000,
            params: {
                id: id
            },
    
            success: function (response, opts) {
                var r = Ext.JSON.decode(response.responseText);
                if (r.success == true) { 
                    var win = Ext.create('Test.ReportWindow', {
                        xfilename: r.filename,
                        xtitle: 'Show PDF file'
                    });
                    win.show();
                } else {
                    Ext.Msg.alert('Attention', r.errmsg);       
                };
            }
        });
    }); 
    

    PHP part:

    <?
    // Create and save file to disk. Return filename to ExtJS.
    // Uncomment next line and generate PDF as you want.
    /*
    require('fpdf.php');
    
    $filename = 'test.pdf';
    $pdf = new FPDF();
    $pdf->AddPage();
    $pdf->SetFont('Arial','B',16);
    $pdf->Cell(40,10,'Hello World!');
    $pdf->Output('F', $filename);
    
    // Exception or other way of error check:
    if ($something_is_wrong) {
       echo "{
            success: false,
            errmsg: 'Something is wrong.'
       }";
       exit;
    }
    */
    
    echo "{
        success: true, 
        filename: '".addslashes($filename)."'
    }";
    ?>
    

    Notes: Tested with ExtJS 4.2.