jQuery upload file using jQuery's ajax method (without plugins)
- by Daniil Harik
Hello,
At moment I want to implement picture upload without using any plug-ins.
My upload form looks like this
<form action="/Member/UploadPicture" enctype="multipart/form-data" id="uploadform" method="post">
<span style="display: none;">
<div class="upload" id="imgUpl">
<h3>Upload profile picture</h3>
<div class="clear5"></div>
<input type="file" name="file" id="file" />
<button class="btn-bl" id="upComplete"><span>Upload</span></button>
</div>
</span>
</form>
And my jQuery code is:
$('#upComplete').click(function () {
$('#up').hide();
$('#upRes').show();
var form = $("#uploadform");
$.ajax({
type: "POST",
url: "/Member/UploadPicture",
data: form.serialize(),
success: function (data) {
alert(data);
}
});
$.fancybox.close();
return false;
});
If I open firebug, I can see that ajax() method does simple form post (not multi-part) and POST content is empty
Is it possible to do files upload using jQuery ajax() method or should I do this in any other way?
Thank You very much
