FileUpload in Boostrap Modal popup

See more:

File-Upload

Hi ,

I am working on MVC5 project , in which we have used Boostrap Modal popup to save the details, and for this we have used common jquery and ajax function which is in one common JS file.

My question is how to save image in database using fileupload in Boostrap Modal popup.
I am getting null in HttpPostedFileBase , i already set the FormMethod = Post on BeginForm.like this.

(Html.BeginForm("CreateAssets", "Assets", FormMethod.Post, new { enctype = "multipart/form-data" , id = "CreateAssets" }))


On mentioning ajaxform , getting values in file but after saving modal popup is not closing.

$('#CreateAssets').ajaxForm(function () {
});


After saving data we are returning true using json.
return Json(new { success = true });

Please suggest how to save image in database using Boostrap modal popup.


Below is the JS file which is used to open and save modal popup

$(function () {
$.ajaxSetup({ cache: false });
$("a[data-modal]").on("click", function (e) {
e.preventDefault()
$('#loadprogress').show();
$('#myModalContent').load(this.href, function () {
$('#myModal').modal({
keyboard: true
}, 'show');
$('#loadprogress').hide();
bindForm(this);

});
return false;
});
});

function bindForm(dialog) {
$('form', dialog).submit(function (e) {
e.preventDefault();
$('#progress').show();
$.ajax({
url: this.action,
type: this.method,
data: $(this).serialize(),
success: function (result) {
if (result.success) {
$('#myModal').modal('hide');
$('#progress').hide();
location.reload();
} else {
$('#progress').hide();
$('#myModalContent').html(result);
bindForm();
}
}
});
return false;
});
}