IE10 download issue with two javascript form submits

Question

So I have a somewhat unique issue I believe and I'm not sure what's the best way around it. I have some legacy code that has worked fine in the past in all browser's and suddenly in IE10 it is not working. I'll try to explain as best I can how it works and what I think is the issue.

I am working on an online banking page which has an option for the user to download their account history as a QIF, CSV, etc. The page is written with Classic ASP and VB server code. The way the feature works is the user clicks the download button which reloads the page with a series of clickable images, one for each download file type. Based on the one they click, a javascript function is then called which submits a hidden form on the page and then submits a second hidden form in order to reload the original view with the account history and filters again. The first form action calls an asp page which builds the file and returns it as a response attachment which usually prompts the browser to download the file, and then the second submit action is just the original asp page with the history details. In IE10, the file doesn't download ever and instead some processing occurs and the second submit which reloads the history goes through fine.

What I've found in my looking is that if I comment out the javascript line that submits the second form, then the download works so I think what's happening is the submits are occuring asynchronously and the redirect one returns before the download one. Or something like that. I'm not sure. I'm trying to figure out a work around without having to completely rewrite the feature. Any thoughts?

EDIT:

The page this all occurs on is accountDetails.asp

The javascript --

function SetOFX(type){
    // There is some code that does conditional handling of the @type parameter
    document.forms.DownloadForm.submit();
    document.forms.Finished.submit();
    return false
}

The DownloadForm --

<form name="DownloadForm" id="DownloadForm" action="downloadofx.asp" method="post">
    <!-- a bunch of input type="hidden" elements -->
</form>

The Finished Form --

<form name="Finished " id="Finished " action="accountDetails.asp" method="post">
    <!-- a bunch of input type="hidden" elements -->
</form>

So the DownloadForm calls a separate asp page to get the download file and then the Finished form posts to the page the user is already on to reload the account history details instead of showing the download image buttons. I realize this is a really bad way of doing this in the first place; this is legacy code written by people who were learning and is already being used in production by hundreds of clients so I can't just rewrite it without a major project approval from my boss and all of our clients.

Though you explained, it's not very clear... What's with a "hidden" form? A form is to let the user give inputs and send data to the server. If it's hidden, better handle all the information server side and use sessions... — Thanh Trung, Apr 15 '13 at 22:49
Do you have the option to edit the "original asp page with the history details" - you may be able to simply move the javascript that calls the asp page that builds the file and returns it as a response attachment to "original asp page with the history details" - making it the last thing that runs after everything else has settled. — G. Stoynev, Apr 15 '13 at 23:45
Thanh Trung, by hidden form I mean a form that's on the page but all the elements are hidden. Forms aren't just used to gather input from a user, they can be used to simply post data to the server. — sanpaco, Apr 16 '13 at 17:47
G Stoynev, that could work but unfortunately would be pretty messy to fix it that way. There is a lot of conditional handling that goes on in the download asp page. — sanpaco, Apr 16 '13 at 17:48

score 0 · Answer 1 · edited May 23 '17 at 12:32

iI haven't tested any of these ideas, but if you want to keep the current architecture, you could try to detect when the file has been completely downloaded and then navigate away.

Have a look at this question to know how to detect when the file has been downloaded by the browser.

Another idea would be to drop the first form submission in favor of a simple a link with an href attribute that points to your file download link, using query string params to pass additionnal data. You might also want to put taget="_blank" on the link if you still experience the same issue without it.

sanpaco · Accepted Answer · 2013-04-25T00:20:00.663

Here's the answer we came up with in the end. The above javascript shouldn't have ever worked in the first place and in fact we found out after testing that it wasn't working in many places but the part we cared about (the file download) was always working. It turns out up until IE10, all browsers have been smart enough to know that you shouldn't submit two forms that way and they ended up ignoring the second submit. IE10 however was processing them both and the redirect was returning before the file download. Since we didn't care about an auto-redirect we just took that submit out and instead added a submit button to the finished form so the user could manually return to the previous view.

The fixed Javascript --

function SetOFX(type){
    // There is some code that does conditional handling of the @type parameter
    document.forms.DownloadForm.submit();
    return false
}

The fixed Finished Form

<form name="Finished" id="Finished" action="accountDetails.asp" method="post">
    <!-- a bunch of input type="hidden" elements -->
    <input type="submit" value="Return to Account Details" />
</form>

IE10 download issue with two javascript form submits

2 Answers2