I'm trying to create multiple upload functionality for Mac Users/Safari using HTML 5 file input multiple field:
<form id="form1" enctype="multipart/form-data" method="post" action="Upload.aspx">
<input type="file" multiple="multiple" id="upload_field" />
<div id="progress_report">
<div id="progress_report_name"></div>
<div id="progress_report_status" style="font-style: italic;"></div>
<div id="progress_report_bar_container" style="width: 90%; height: 5px;">
<div id="progress_report_bar" style="background-color: blue; width: 0; height: 100%;"></div>
</div>
</div>
</form>
I found a nice jquery plugin that uses the html5 file input. One of the paramaters is "url", which the author states as "(string|function) url where send files, or function which wil return it". I'm assuming this is where I would do my ajax call to my c#
function that uploads the file. Below is what I have, which calls the c# function correctly. My issue is I don't know what I should be passing/or how to grab the file from the c# function:
$(function() {
$("#upload_field").html5_upload({
url: function(number) {
//return prompt(number + " url", "/");
return Ajax.CreativeServices.FileUpload();
},
sendBoundary: window.FormData || $.browser.mozilla,
onStart: function(event, total) {
return true;
return confirm("You are trying to upload " + total + " files. Are you sure?");
},
onProgress: function(event, progress, name, number, total) {
console.log(progress, number);
},
setName: function(text) {
$("#progress_report_name").text(text);
},
setStatus: function(text) {
$("#progress_report_status").text(text);
},
setProgress: function(val) {
$("#progress_report_bar").css('width', Math.ceil(val*100)+"%");
},
onFinishOne: function(event, response, name, number, total) {
//alert(response);
},
onError: function(event, name, error) {
alert('error while uploading file ' + name);
}
});
});
Ajax:
ns.FileUpload = function () {
$.ajax({
url: CS_AJAX_URL,
data: {
Function: "FileUpload"
},
type: 'POST',
success: function (json) {
return false;
},
error: function (xhr, err) {
},
complete: function () {
}
});
}
What, if anything do I pass to my function? How do I read the file field from C#?
Any help is appreciated.
James
Confused Trying to Upload File
Mark As Answer.
