User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; WOW64; Trident/4.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; .NET4.0C; .NET4.0E)
$('#UploadImage').click(function () {
var formData = new FormData();
formData.append('file', $('input[type=file]')[0].files[0]);
var filevalue = $('file').val();
$.ajax({
url: "/controller/action",
data: formData,
processData: false,
contentType: false,
type: 'POST',
success: function (data, status, xhr) {
$('#FileId').val(data);
$('#file').val('');
var msg = "You have successfully Uploaded a Image.";
$("#Error").html(msg + xhr.status + " " + xhr.statusText);
$('#dialog').show();
$('#DialogMessage').text(msg);
$("#dialog").dialog({
modal: true,
resizable: false,
buttons: {
"Yes": function () {
$(this).dialog("close");
}
}
});
},
error: function (err) {
if (status == "error") {
var msg = "Sorry but there was an error: ";
alert(msg);
$("#Error").html(msg + xhr.status + " " + xhr.statusText);
}
}
});
});
<table class="dialogTable">
<tr>
<td><b>Select your file</b></td>
</tr>
<tr>
<td>
<input type="file" name="file" id="file" accept="gif|jpeg|bmp|png|jpg" /></td>
</tr>
</table>
<table>
<tr>
<td>
<input type="button" id="UploadImage" value="Upload Image" />
</td>
</tr>