Register now or log in to join your professional community.
no jquery or any library
you can use HTML5 upload process for that particular step, or set your upload page target to blank page (Pop-up) to avoid full page reload.
HTML5 , otherwise go with AJAX (which you dont want to)!!
var AjaxFileUploader = function () {
this._file = null;
var self = this;
this.uploadFile = function (uploadUrl, file) {
var xhr = new XMLHttpRequest();
xhr.onprogress = function (e) {
...
};
xhr.onload = function (e) {
...
};
xhr.onerror = function (e) {
...
};
xhr.open("post", uploadUrl, true);
xhr.setRequestHeader("Content-Type", "multipart/form-data");
xhr.setRequestHeader("X-File-Name", file.name);
xhr.setRequestHeader("X-File-Size", file.size);
xhr.setRequestHeader("X-File-Type", file.type);
xhr.send(file);
};
};
AjaxFileUploader.IsAsyncFileUploadSupported = function () {
return typeof (new XMLHttpRequest().upload) !== 'undefined';
}
if (AjaxFileUploader.IsAsyncFileUploadSupported) {
ajaxFileUploader = new AjaxFileUploader();
$("form").submit(function () {
var uploader = $("#fileUploader")[0];
if (uploader.files.length ==0) {
return;
} else {
ajaxFileUploader.uploadFile(
"/YourUploadUrl",
uploader.files[0]);
}
return false;
});
}
source: http://stackoverflow.com/questions//ajax-file-upload-form-submit-without-jquery-or-iframes
You said with out reloading. if that is the case then a normal submit button would do the job. If that is not the intended question, then as Mr.Daanish Rumani had said you can use flash or some other alternative. But in the end a http request header has to be generated for communicating with the server.
read about uploading using iframe.
You can use hidden iframe and make form target to that.
Yes a simple jquery plugin: http://blueimp.github.io/jQuery-File-Upload/
