IE9 - Message Bar to download file appears on Parent Window; not current

Answered IE9 - Message Bar to download file appears on Parent Window; not current

  • Friday, September 16, 2011 2:25 PM
     
     

    One of the features of my Web App is that it prints reports. These reports require a pop-up window allowing the user to refine the parameters of the report. This cannot change.

    Pre-IE9, when the user clicked my "Preview" button on the pop-up window, they would get a dialog like this once the report rendered:

    This is easy and intuitive to my clients.

     

    However, after upgrading to IE9, the Message Bar (Information Bar/Download Bar) whatever it's called, shows in the PARENT window of the pop-up:

     

    In order to download or open the report, the user is now required to close the pop-up window and then select the appropriate action on the Download Bar.

     

    This is a pretty frustrating work-around.

     

    I've looked for ways on the net to either show the the Download Bar on the pop-up window (preferred), revert to the old dialog, or remove it all together.

     

    No solutions yet. If anyone has any IE solutions/work-arounds, please post them.

All Replies

  • Tuesday, September 20, 2011 9:27 AM
    Moderator
     
     

    Hi Ray,

    Does your website have a public URL that we can go to reproduce this problem?

    thanks.


    Please mark the replies as answers if they help or unmark if not.
    If you have any feedback about my replies, please contact msdnmg@microsoft.com
    Microsoft One Code Framework
  • Wednesday, September 21, 2011 8:48 PM
     
      Has Code
    Nothing I would feel comfortable giving out pubicly, but I can PM one if the following example doesn't help.
     
    Ok, so I looked deeper in the code and found something that will produce an issue.  It's different than my original issue, but maybe perhaps related.
    What you need:
    • IIS 7.0
    • Windows 7
    Now Create the following four files:
    PageOne.htm with the following contents:
     
    <html>
    	<head>
    		<script type="text/javascript">
    			window.dialog = new Object();
    			
    			var myFunc = function() { window.alert('hello')};
    
    			function test(){
    				window.dialog.open('DummyDialog.htm',myFunc,false);
    				};
    				
    				
    			window.dialog.open = function(sUrl, fpReturn, bNoResize) {
    
    				window.dialog.__returnFunction = fpReturn;
    				window.dialog.returnValue = null;
    
    				window.dialog.arguments = new Array();
    				for (var x = 2; x < arguments.length; x++) {
    					window.dialog.arguments[x - 2] = arguments[x];
    				}
    
    				window.dialog.arguments[window.dialog.arguments.length] = window;
    				
    				sUrl += new Date().getTime().toString(); 
    				
    				
    				var sFeatures;
    				var nWidth = 500;    var nHeight = 500;    var nLeft = 100;    var nTop =  100;
    				
    				if (window.dialog.position) {
    					nLeft = window.dialog.position.left;
    					nTop = window.dialog.position.top;
    					window.dialog.position = null;
    				} 
    
    				if (sUrl.indexOf("?") != -1) {
    					var pairs = sUrl.split("?")[1].split("&");
    					var aValue, pos;
    					for (var i = 0; i < pairs.length; i++) {
    						if (pairs[i].toUpperCase().indexOf("SIZE") == 0) {
    							aValue = pairs[i].split("=")[1].split(",");
    							if (aValue.length == 2) {
    								nWidth = parseInt(aValue[0]);
    								nHeight = parseInt(aValue[1]);
    								break;
    							} else if (aValue.length == 4) {
    								nWidth = parseInt(aValue[0]);
    								nHeight = parseInt(aValue[1]);
    								nLeft = parseInt(aValue[2]);
    								nTop = parseInt(aValue[3]);
    								break;
    							}
    						}
    					}
    				}
    				
    				nTop -= 1;
    
    				sFeatures = "";
    				
    				window.dialog.arguments._gotoURL = sUrl;
    				window.dialog.arguments._dialogTitle = 'my title';
    				window.dialog.returnValue = window.showModalDialog("DummyDialog.htm", window.dialog.arguments, sFeatures);
    			};
    		</script>
    	</head>
    	<body>
    		<a href="#" onclick="test();">Test Window</a>
    	</body>
    </html>
    

    DummyDialog.htm with the following contents:
    <html>
    	<head>
    		<script type="text/javascript">
    			window.dialog = new Object();
    			
    			var myFunc = function() { window.alert('hello')};
    
    			function test(){
    				window.dialog.open('DummyDialog.htm',myFunc,false);
    				};
    				
    				
    			window.dialog.open = function(sUrl, fpReturn, bNoResize) {
    
    				window.dialog.__returnFunction = fpReturn;
    				window.dialog.returnValue = null;
    
    				window.dialog.arguments = new Array();
    				for (var x = 2; x < arguments.length; x++) {
    					window.dialog.arguments[x - 2] = arguments[x];
    				}
    
    				if (true) {//if (is.ie) {
    					window.dialog.arguments[window.dialog.arguments.length] = window;
    				}
    				
    				sUrl += new Date().getTime().toString();
    				// in pixels
    				var sFeatures;
    				var nWidth = 500;
    				var nHeight = 500;
    				var nLeft = 100;
    				var nTop =  100;
    				
    				if (window.dialog.position) {
    					nLeft = window.dialog.position.left;
    					nTop = window.dialog.position.top;
    					window.dialog.position = null;
    				} 
    
    				if (sUrl.indexOf("?") != -1) {
    					var pairs = sUrl.split("?")[1].split("&");
    					var aValue, pos;
    					for (var i = 0; i < pairs.length; i++) {
    						if (pairs[i].toUpperCase().indexOf("SIZE") == 0) {
    							aValue = pairs[i].split("=")[1].split(",");
    							if (aValue.length == 2) {
    								nWidth = parseInt(aValue[0]);
    								nHeight = parseInt(aValue[1]);
    								break;
    							} else if (aValue.length == 4) {
    								nWidth = parseInt(aValue[0]);
    								nHeight = parseInt(aValue[1]);
    								nLeft = parseInt(aValue[2]);
    								nTop = parseInt(aValue[3]);
    								break;
    							}
    						}
    					}
    				}
    
    				nTop -= 1;		
    				sFeatures = "";
    				window.dialog.arguments._gotoURL = 'download.aspx?file=MyTestFile.txt';
    				window.dialog.arguments._dialogTitle = 'my title';//window.getTitle();
    				window.dialog.returnValue = window.showModalDialog('download.aspx?file=MyTestFile.txt', window.dialog.arguments, sFeatures);
    
    			};
    		</script>
    	</head>
    	<body>
    		<a href="#" onclick="test();">Test Window</a>
    	</body>
    </html>
    
    

    download.aspx with the following contents:
     
    <%@ Page language="vb" runat="server" explicit="true" strict="true" %>
    <script language="vb" runat="server">
    Sub Page_Load(Sender As Object, E As EventArgs)
    	Dim strRequest As String = Request.QueryString("file") '-- if something was passed to the file querystring
    	If strRequest <> "" Then 'get absolute path of the file
    		Dim path As String = Server.MapPath(strRequest) 'get file object as FileInfo
    		Dim file As System.IO.FileInfo = New System.IO.FileInfo(path) '-- if the file exists on the server
    		If file.Exists Then 'set appropriate headers
    			Response.Clear()
    			Response.AddHeader("Content-Disposition", "attachment; filename=" & file.Name)
    			Response.AddHeader("Content-Length", file.Length.ToString())
    			Response.ContentType = "application/octet-stream"
    			Response.WriteFile(file.FullName)
    			Response.End 'if file does not exist
    		Else
    			Response.Write("This file does not exist.")
    		End If 'nothing in the URL as HTTP GET
    	Else
    		Response.Write("Please provide a file to download.")
    	End If
    End Sub
    </script>
    

    MyTestFile.txt with the following content:
     
    <Root>
      <Tag>Hello World</Tag>
    </Root>
    

    Now do the following:
    1. Drag all four files to your IIS directory and navigate to PageOne.htm. 
    2. Click Test Window (DummyDialog.htm should popup)
    3. Click the hyperlink in that PopUp (this should take you to http://localhost/download.aspx?file=MyTestFile.txt)
      What's supposed to happen is that you should be prompted for download.  Instead, what I get is a blank window that does nothing.  See below:
      If you take that same url http://localhost/download.aspx?file=MyTestFile.txt and paste it directly into a new IE window or, alternatively, run the same steps above in Firefox or Chrome, you'll be prompted for download.
      IE does nothing though.  Why not?
  • Thursday, September 22, 2011 3:38 AM
    Moderator
     
     
    Hi ray023,

    Thanks you for provding the detailed markup.

    I follow your steps and come cross the same issue with you. It seems that download from a modal dialog window has some problem. I also test window.open("download.aspx?file=MyTestFile.txt"); to popup a window for download.aspx to download, however it only display the the Download Bar not pop up window .

    the download.aspx is just for download, in my opinion, it is not necessary to popup download.aspx, if that, you can simply place <a href="download.aspx?file=MyTestFile.txt">download</a> in DummyDialog.htm. runing it ,you can find the download list will popup on DummyDialog.htm and alert user to open or save. 

    however, if you insist to  popup modal window download. aspx and show the the Download Bar on it in IE9, you can submit you feedback to following site in the formal way: http://connect.microsoft.com/

    Please try my advice and let me know how it goes in your side.

    Thanks.


    Please mark the replies as answers if they help or unmark if not.
    If you have any feedback about my replies, please contact msdnmg@microsoft.com
    Microsoft One Code Framework
  • Thursday, September 22, 2011 3:38 AM
    Moderator
     
     Answered
    Hi ray023,

    Thanks you for provding the detailed markup.

    I follow your steps and come cross the same issue with you. It seems that download from a modal dialog window has some problem. I also test window.open("download.aspx?file=MyTestFile.txt"); to popup a window for download.aspx to download, however it only display the the Download Bar not pop up window .

    the download.aspx is just for download, in my opinion, it is not necessary to popup download.aspx, if that, you can simply place <a href="download.aspx?file=MyTestFile.txt">download</a> in DummyDialog.htm. runing it ,you can find the download list will popup on DummyDialog.htm and alert user to open or save.

    however, if you insist to popup modal window download. aspx and show the the Download Bar on it in IE9, you can submit you feedback to following site in the formal way: http://connect.microsoft.com/

    Please try my advice and let me know how it goes in your side.

    Thanks.


    Please mark the replies as answers if they help or unmark if not.
    If you have any feedback about my replies, please contact msdnmg@microsoft.com
    Microsoft One Code Framework
  • Thursday, September 29, 2011 9:32 AM
    Moderator
     
     

    Hi ray023,

    Are there any updates for your concern?

    Best regards,
    Yanping Wang


    Please mark the replies as answers if they help or unmark if not.
    If you have any feedback about my replies, please contact msdnmg@microsoft.com
    Microsoft One Code Framework
  • Friday, September 30, 2011 2:13 AM
    Moderator
     
     

    Hi ray023,

    I've marked my reply as answer here so that other community members who have similar concerns as you can try some suggestions to handle the case.

    If you have any concern, please feel free to let me know.

    Best regards,
    Yanping Wang


    Please mark the replies as answers if they help or unmark if not.
    If you have any feedback about my replies, please contact msdnmg@microsoft.com
    Microsoft One Code Framework
  • Thursday, May 03, 2012 2:33 PM
     
      Has Code

    Hi ray023,

    I may have a potential solution for you (it certainly worked for me).

    On the page which appears in the modal dialog, add an iFrame in the HTML markup, E.g.:

    <iframe id="fraDownload" frameborder="0" width="100" height="100" style="display: none;" />

    Then, where you have your export/download button (that would normally postback and send the file as a binary response to the browser window), replace the onclick action to point to a JavaScript function that sets the src (URL) of the new iframe. E.g.

    <asp:HyperLink ID="lnkDownload" Text="download" NavigateUrl="#" onclick="javascript:downloadFile('myreport.pdf');" runat="server" />
    function downloadAttachment(filename) {
         document.getElementById('fraDownload').src = 'report_manager.aspx?action=download&filename=' + filename;
    }		

    Now implement the file download action in the target page of the iframe (in this example it's report_manager.aspx). E.g.:

    'Get file length (in bytes) oFI = New FileInfo(sFileFullPath) iFileLength = oFI.Length 'Setup response to force file download '(The technique used below is taken from article: http://www.west-wind.com/weblog/posts/76293.aspx) With Response .Clear() .ClearHeaders() .Buffer = False .Cache.SetCacheability(HttpCacheability.NoCache) .ContentType = "application/octet-stream" .AppendHeader("Content-Length", iFileLength.ToString()) .AppendHeader("Connection", "Keep-Alive") .AppendHeader("Content-Disposition", String.Format("attachment; filename={0}", Me.SelectedFilename)) .TransmitFile(sFileFullPath) End With

    (Note that the above code is not complete - it's just to illustrate what I'm referring to)

    When you run your code, bring up your Modal Dialog and then click on the Export/Download link, IE9 will happily allow your download now that it comes from the iframe embedded in your page rather than the page itself!

    Kind Regards,

    Paul