IE load event?

[bryan-williams]

Great script. However, point me in the right direction to work around "[IE] will only register a load event if the Content-type of the response is set to text/plain or text/html, not if it is set to application/json."

I'm using a C# generic handler server-side for the ajax call, but never get there. Content-type of the container page is text/html. Where do I set the content type so that IE registers the load event?

Sorry if this is a bone-head question, rather new at this.

[blueimp]

Your server-side handler is expected to send a JSON response to the file upload request, similar to the example in the Setup Guide.
See How to create JSON string in C# for some examples.

If you don't explicitly set the Content-type header of your response to "application/json", the default Content-type of your .NET handler will probably be "text/html" and should be just fine.

[bryan-williams]

Sorry, I wasn't clear in my description of my issue, and have subsequently found a workaround, though the underlying problem may be worth noting.

The script works beautifully in Chrome and FF. The load event of the input control simply didn't fire in IE. After a bit of investigation, I found a workaround and possibly a bug.

For styling reasons, we didn't want to use the basic [input] element on the page and instead used an anchor to trigger the file selection, e.g. clicking the anchor would "click" the [input] element. I was using jquery to trigger the click() event of the [input] element, e.g.

$("a.[class name]").click(
            function(event){
                event.preventDefault();
                $("input.[class name]").click();
            }
        );

This is fine in Chrome and FF, but IE has some problem with it. However,

document.getElementById("[my element's id]").click();

works perfectly. Perhaps I need to pass some event data in the jquery approach? I'm not sure, I suppose that there's some tweak to the shim that would solve the problem. But in any event, I hope this little nugget might help someone in a similar quandary.

[bryan-williams]

as an additional observation, excluding
event.preventDefault();
or using an ID instead of a classname, e.g.
$("input#[my id]").click();
made no difference, the event never fired in either case.

[blueimp]

HTML input elements don't have an associated load event.
The interesting events for the file input are the click event (when clicking on the file input selection button) and the change event (after a selection has been made).

Apparently, you try to invoke the click event on the file input programmatically.
However several browsers prevent this for security reasons.
As far as I know, only Firefox 4 (which is still in Beta) allows to invoke a click event programmatically:
[Using hidden file input elements using the click() method](https://developer.mozilla.org/en/Using_files_from_web_applications#Using_hidden_file_input_elements_using_the_click(\)_method).

Styling the file input itself is not possible (again, browsers seem to prevent this for security reasons), but making it transparent and moving it on top of a styleable element is possible and done via the jQuery File Upload's CSS definitions.