Page 1 of 2 12 LastLast
Results 1 to 10 of 13

Thread: Download File on('click')

  1. #1
    Sencha User
    Join Date
    Jul 2007
    Location
    Moscow, Russia
    Posts
    295
    Vote Rating
    0
      0  

    Default Download File on('click')

    Hi,
    I founded one suggestion for download file via ajax.
    Is it possibly to download file on button click?
    I try to sent ajax query:
    PHP Code:
                function doDownload(){
                        
                        
    Ext.Ajax.request({
                            
    url 'my_url',
                            
    params: {licensem[0].get('id')},
                            
    success: function ( respopt ) { 
                                
    //alert('Success');
                            

                        });
                    
                } 
    And backside-script:
    PHP Code:
          <?php
          header
    ("Content-Type: application/force-download\n");
          
    header("Content-Disposition: attachment; filename=".$_GET['fileName']);
          
    header('Content-Disposition: attachment; filename="'.$_GET['fileName'].'"');
          
    readfile($_GET['fileName']);
          
    ?>
    But files contents showing on browser window.
    Last edited by 6epcepk; 15 Feb 2008 at 6:11 AM. Reason: moved to 2.x Help from Open Discussion

  2. #2
    Ext User
    Join Date
    Dec 2007
    Posts
    6
    Vote Rating
    1
      1  

    Default Try this

    I don't think you're going to have too much success getting the file down through ajax.
    It's been covered here partially before.
    I just went through this yesterday and this was my solution:

    The javascript:
    Code:
    try {
        Ext.destroy(Ext.get('downloadIframe'));
    }
    catch(e) {}
    Ext.DomHelper.append(document.body, {
        tag: 'iframe',
        id:'downloadIframe',
        frameBorder: 0,
        width: 0,
        height: 0,
        css: 'display:none;visibility:hidden;height:0px;',
        src: 'somelocation.php'
    });
    The try/catch block tries to clear out previous iframes, just to keep things tidy.

    On the PHP side:
    PHP Code:
    header('Cache-Control: maxage=120');
    header('Expires: '.date(DATE_COOKIE,time()+120)); // Cache for 2 mins
    header('Pragma: public');
    header("Content-type: application/force-download"); 
    header("Content-Transfer-Encoding: Binary"); 
    header('Content-Type: application/octet-stream'); 
    header('Content-Disposition: attachment; filename="somefilename.extention");
    echo file_get_contents ($somefilelocation); 
    The Cache-control is to deal with extremely annoying IE issues where saving the document is akin to a new request, and in conjunction with php and automatically generated files, you may find the streamed file is out of IE's cache.

    This is tested for FF and ie6.

    Hope this helps.

  3. #3
    Sencha User
    Join Date
    Jul 2007
    Location
    Moscow, Russia
    Posts
    295
    Vote Rating
    0
      0  

    Default

    Amazing!
    But where you placed js-code?
    I try to sets into onclick evening, but when I click, no requests sents to server. Can you post full js-code?
    Thanks.

  4. #4
    Ext User
    Join Date
    Dec 2007
    Posts
    6
    Vote Rating
    1
      0  

    Default

    Are you positive your click event is firing?
    The js code I posted is all you need to get contents from 'somelocation.php'.

    But if you feel like it, you can pick over the full js.
    This is the exact download event I use:
    Code:
    download=function(fileId) {
            Ext.Ajax.request({
                url:config.values.urlSubmit,
                params: {method:'requestDownload',id:fileId},
                success: function(response) {
                    results = Ext.decode(response.responseText);
                    try {
                        Ext.destroy(Ext.get('downloadIframe'));
                    }
                    catch(e) {}
                    Ext.DomHelper.append(document.body, {
                        tag: 'iframe',
                        id:'downloadIframe',
                        frameBorder: 0,
                        width: 0,
                        height: 0,
                        css: 'display:none;visibility:hidden;height:0px;',
                        src: 'ajax.php?method=initiateDownload&sessionKey='+ajaxExtraParams.values.sessionKey+'&sessionOneTimeKey='+ajaxExtraParams.values.sessionOneTimeKey+'&id='+fileId
                    });
                },
                failure: function() {
                    if (results.message) {
                        Ext.Msg.alert('Infomation',results.message);
                    }
                    files.Module.pullData();
                }
            });
        },
    I have a two step process, which may be more complicated than what your are doing.
    This fx first asks the server for permission to download the file (the outer ajax request) and then if successful opens the iframe which initiates the download. As you can see, not too much more complicated than the previous example.

    If it still doesn't work, are you sure the event is actually firing? No interceptors preventing it?

  5. #5
    Sencha User
    Join Date
    Jul 2007
    Location
    Moscow, Russia
    Posts
    295
    Vote Rating
    0
      0  

    Default

    Oh sorry, I forgot to sent variable with iFrame, so script returns error, I inspected html and remove mistake.
    Thanks for premium help!

  6. #6
    Ext User PLaYoNe's Avatar
    Join Date
    Mar 2009
    Location
    Sucre - Bolivia
    Posts
    9
    Vote Rating
    0
      0  

    Default file's path

    hi, i would like to know how to define the file's path for downloading a specific file, for example if i upload a file into uploads folder inside my app folder, then i want to download from there that file

    Thanks!
    -.-lml

  7. #7
    Sencha - Ext JS Dev Team mschwartz's Avatar
    Join Date
    Nov 2008
    Location
    San Diego, Peoples' Republic of California
    Posts
    2,056
    Vote Rating
    19
      0  

    Default

    Quote Originally Posted by PLaYoNe View Post
    hi, i would like to know how to define the file's path for downloading a specific file, for example if i upload a file into uploads folder inside my app folder, then i want to download from there that file

    Thanks!
    Code:
    try {
        Ext.destroy(Ext.get('downloadIframe'));
    }
    catch(e) {}
    Ext.DomHelper.append(document.body, {
        tag: 'iframe',
        id:'downloadIframe',
        frameBorder: 0,
        width: 0,
        height: 0,
        css: 'display:none;visibility:hidden;height:0px;',
        src: 'somelocation.php?file=file_to_download'
    });
    See bolded addition.

    Fix your somelocation.php script to send "file_to_download"

  8. #8
    Ext User PLaYoNe's Avatar
    Join Date
    Mar 2009
    Location
    Sucre - Bolivia
    Posts
    9
    Vote Rating
    0
      0  

    Default file's path

    thank you, i wil try this and after tell you what happened
    -.-lml

  9. #9
    Ext User PLaYoNe's Avatar
    Join Date
    Mar 2009
    Location
    Sucre - Bolivia
    Posts
    9
    Vote Rating
    0
      0  

    Default

    hi i dont understand this line:

    Ext.Ajax.request({
    url:config.values.urlSubmit,
    params: {method:'requestDownload',id:fileId},

    the url has to be the same than src: 'somelocation.php?file=file_to_download' ?
    -.-lml

  10. #10
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,607
    Vote Rating
    59
      0  

    Default

    Jusr use a LinkButton: http://www.extjs.com/forum/showthread.php?t=80639

    Hmm.. well, that's an Ext 3 version. There are Ext 2 versions posted somewhere in the forums.

Page 1 of 2 12 LastLast

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •