jQuery Parallel XMLHttpRequests
To demonstrate that multiple POSTs are processed in parallel.
HTML
<!DOCTYPE html>
<html>
<head>
<title>Parallel Ajax Test</title>
<script src="scripts/jquery-1.8.3.js" type="text/javascript"></script>
<script src="scripts/test2.js" type="text/javascript"></script>
</head>
<body>
<p>
<input id="files-upload" type="file" multiple="multiple" />
</p>
<p id="files-result">
</p>
</body>
</html>
JavaScript
/// <reference path="jquery-1.8.0.js" />
$(document).ready(function () {
//var url = "http://html5labs.interoperabilitybridges.com/CORS/upload.ashx";
// var url = "http://localhost:60905/restricted/Uploader.ashx";
var $fileResult = $("#files-result");
$("#files-upload").on("change", function () {
if (this.files.length > 0) {
for (var i = 0, l = this.files.length; i < l; i++) {
var fileUpload = new Uploader(this.files[i]);
}
}
});
var Uploader = function (file) {
$.ajax({
crossDomain: true,
url: url,
type: "POST",
timeout: 20000,
async: true,
data: file,
processData: false,
headers: {
"Content-Type": file.type,
"X-File-Name": file.name,
"X-File-Size": file.size,
"X-File-Type": file.type,
"BH-CustID": "99999",
"BH-Description": "Shortform Brochure",
"BH-AdvertID": "123"
},
complete: function (jqXHR, textStatus) {
var result = " uploaded.<br/>";
if (textStatus != "success") {
result = " failed (" + textStatus + ").<br/>";
}
$fileResult.text($fileResult.text() + "File " + file.name + result);
}
});
};
});