0

I am currently using the following JS Code to do my Ajax calls:

var ajax = {};
ajax.x = function () {
    if (typeof XMLHttpRequest !== 'undefined') {
        return new XMLHttpRequest();
    }
    var versions = [
        "MSXML2.XmlHttp.6.0",
        "MSXML2.XmlHttp.5.0",
        "MSXML2.XmlHttp.4.0",
        "MSXML2.XmlHttp.3.0",
        "MSXML2.XmlHttp.2.0",
        "Microsoft.XmlHttp"
    ];

    var xhr;
    for (var i = 0; i < versions.length; i++) {
        try {
            xhr = new ActiveXObject(versions[i]);
            break;
        } catch (e) {
        }
    }
    return xhr;
};

ajax.send = function (url, callback, method, data, async) {
    if (async === undefined) {
        async = true;
    }
    var x = ajax.x();
    x.open(method, url, async);
    x.onreadystatechange = function () {
        if (x.readyState == 4) {
            callback(x.responseText)
        }
    };
    if (method == 'POST') {
        x.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
    }
    x.send(data)
};

ajax.get = function (url, data, callback, async) {
    var query = [];
    for (var key in data) {
        query.push(encodeURIComponent(key) + '=' + encodeURIComponent(data[key]));
    }
    ajax.send(url + (query.length ? '?' + query.join('&') : ''), callback, 'GET', null, async)
};

ajax.post = function (url, data, callback, async) {
    var query = [];
    for (var key in data) {
        query.push(encodeURIComponent(key) + '=' + encodeURIComponent(data[key]));
    }
    ajax.send(url, callback, 'POST', query.join('&'), async)
};

And I currently have this little snippet that calls my controller's action and send the input file to the controller:

function UpdateChapterText() {
    try {
        document.getElementById("chapterTextInput").value = "";
    } catch (e) { }

    ajax.post('/Create/ImportFromFile', document.getElementById("chapterFile"), function (data, e) {
        document.getElementById("chapterTextInput").value = data;
    });
}

The element with "chapterFile" as the ID is the input element with type="file". Here is my controller:

[HttpPost]
public ActionResult ImportFromFile(HttpPostedFileBase chapterFile)
{
    string path = Path.GetFileName(chapterFile.FileName);
}

However, after debugging, it looks like the HttpPostedFileBase chapterFile always remains null. Am I sending over the element wrong entirely?

Thanks.

George Daniel
  • 570
  • 6
  • 9
  • 1
    `ActiveXObject`? Are you really forcing all your users to use IE? Consider using [FormData](https://developer.mozilla.org/en-US/docs/Web/API/FormData/Using_FormData_Objects) - refer [example](https://stackoverflow.com/questions/29293637/how-to-append-whole-set-of-model-to-formdata-and-obtain-it-in-mvc/29293681#29293681) using jQuery –  Feb 15 '18 at 23:42
  • Hmm? It's been working on Firefox/Safari/Chrome as far as I've tested so far. – George Daniel Feb 15 '18 at 23:49
  • I've been passing in the data incorrectly, I just noticed. I am passing the data in the ajax.post as follows now: ajax.post('/Create/ImportFromWord', { dataName: 'data' }, function (data, e) { } Does not seem like this ajax call can support sending over file inputs... – George Daniel Feb 15 '18 at 23:51
  • 1
    If you want to do this without `FormData`, refer [Submitting forms and uploading files](https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/Using_XMLHttpRequest#Submitting_forms_and_uploading_files) –  Feb 15 '18 at 23:58

0 Answers0