Showing download dialog box using iFrame

Question

I am working on an JavaScript application using EmberJs. On click of a button, I make an ajax call using Jquery & this calls returns me a file path. Now under the success function of the jquery, I want to pass this path to an iframe which should eventually show me the download dialog box.

$.ajax({
        type: 'GET',
        url: exportURL,
        success: function(result) {
       //Result contains a value which is abc.xlsx**
       //Now how can i show the download dialog?
    }
  });

The idea is to show the download dialog by passing the file path. What options do I have? I don't want to post-back the page.

I don't understand where you have problems. Do you not know how to show the button? You don't want to reload the page in the iframe? Isn't the download on an extra blank page? Please also include your ajax code and the HTML used. — Spokey, Sep 16 '14 at 12:00
@Spokey I am able to add button, make jquery call & able to get the file path from the server. Now I just need to show the download dialog. How can I show the download dialog? — SharpCoder, Sep 16 '14 at 12:02
In most cases if you link to the file it will automatically download. Depending on the server side you will have to set the header to force download. here's an example http://stackoverflow.com/a/3600580/2220391 — Spokey, Sep 16 '14 at 12:08

score 0 · Answer 1 · answered Sep 16 '14 at 13:08

As suggested by spokey, I have added iframe like this:

 <iframe id="secretIFrame" src="" style="display:none; visibility:hidden;"></iframe>

on the Js side:

$.ajax({
        type: 'GET',
        url: exportURL,
        success: function(result) {
             $('#secretIFrame').attr('src','http://localhost:1234/file/fileName');       

    }
  });

http://localhost:1234/file/fileName is asp.net web api restful service and file is the controller which takes file name as parameter and it looks like this:

public class FileController : ApiController
    {
        public HttpResponseMessage Get(string id)
        {

            var path = Path.Combine("temp", id);
            HttpResponseMessage response = new HttpResponseMessage(HttpStatusCode.OK);

            response.Content = new StreamContent(new FileStream(path, FileMode.Open, FileAccess.ReadWrite));
            response.Content.Headers.ContentDisposition = new System.Net.Http.Headers.ContentDispositionHeaderValue("attachment");
            response.Content.Headers.ContentDisposition.FileName = id;
            return response;

        }
    }

Showing download dialog box using iFrame

1 Answers1