jQuery fileupload not working in IE 8 and 9

Question

This code works in FF and chrome. In IE 8 or 9 I get a 500 error saying a not null property is null.

Here is the html

<div id="upload_button_div_general" class="fileupload-buttonbar" data-url="/Upload/SomeMethod">
    <label class="fileinput-button ui-button ui-widget ui-state-default ui-corner-all ui-button-text-icon-primary" role="button"> 
        <span class="ui-button-text">
            <span>Add Documents...</span> 
        </span>
        <input id="upload_button" type="file" name="postedFiles" multiple="" />
    </label>
</div>
<div id="UploadMessage" data-bind="visible: showMessage"> 
    <span>Documents</span>

    <ul data-bind="foreach: upload()">
        <li> 
            <a href="#" data-bind="click: $parent.openFile">
                <span data-bind="text: $data.fileName">  </span>
            </a>
        </li>
    </ul>
</div>

Here is the javascript

function Upload(div, additionalParams, successFunc, failureFunc) {
    $('#' + div).fileupload({
        dataType: 'json',
        url: rootPath + 'Upload/SomeMethod',
        formData: additionalParams,
        start: function (e, data) {
            showLoading();
        },
        stop: function (e, data) {
            hideLoading();
        },
        add: function (e, data) {
            data.submit();
        },
        always: function (e, data) {
            var result = data.result;
            if (result.HasError) {
                failureFunc(result.Error);
            } else {
                successFunc(result);
            }
        }
    });
};

The controller method is

public virtual JsonResult SomeMethod(IEnumerable<HttpPostedFileBase> postedFiles, int id)

Answer 1

I was able to get it working by including jquery.iframe-transport.js and then I had to remove my knockout "with" data-bind from the div to get it to work in IE8 because it worked in IE9. (I had a with binding above my posted code) Thanks for all the suggestions.

Answer 2

As this function is working fine in FF, there is only one possibility that the variables you are passing here are undefined just for IE.

Check each variables values in IE console.

Hint: IE is strict about types and everything.

For example:

parseInt(Number);  

FF and Chrome assumes it as decimal value whereas IE assumes it as octal number. So, giving parseInt(Number,10) is recommended.

And even regarding dates, if you provide

var currentDate = new Date("March 18, 2013 11:13:00")

Works good in Chrome and FF, but shows undefined or invalid Date in IE.

You can find more about the recommended notation of the date here

So, in the above examples I am just trying to say you that you may have forgotten to declare type, or correct notation.

Though, this is not the answer you were looking for, I hope this information will help you.

Update: As the error is 500 error, then the problem could be more possibly in rootPath variable's value.