Boostrap Modal弹出窗口中的FileUpload [英] FileUpload in Boostrap Modal popup

查看:144
本文介绍了Boostrap Modal弹出窗口中的FileUpload的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述





我正在研究MVC5项目,其中我们使用Boostrap Modal弹出窗口来保存细节,为此我们使用了常见的jquery和ajax函数在一个常见的JS文件中。



我的问题是如何使用Boostrap Modal弹出窗口中的fileupload在数据库中保存图像。

我在HttpPostedFileBase中得到null,我已经在BeginForm上设置了FormMethod = Post。就像这样。



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





提及ajaxform ,获取文件中的值,但保存模式弹出窗口后没有关闭。



$('#CreateAssets')。ajaxForm(function(){

});





保存数据后,我们使用json返回true。

返回Json(新的{success = true});



请建议如何保存图像i n数据库使用Boostrap模态弹出窗口。





下面是JS文件,用于打开和保存模态弹出窗口



$(function(){

$ .ajaxSetup({cache:false});

$(a [数据] -modal])。on(click,function(e){

e.preventDefault()

$('#loadprogress')。show();

$('#myModalContent')。load(this.href,function(){

$('#myModal')。modal({

键盘:true

},'show');

$('#loadprogress')。hide();

bindForm (这);



});

返回false;

});

});



函数bindForm(对话框){

$('form',dialog).submit(function(e) ){

e.preventDefault();

$('#progress')。show();

$ .aj ax({

url:this.action,

类型:this.method,

数据:$(this).serialize(),

成功:函数(结果){

if(result.success){

$('#myModal')。modal('hide ');

$('#progress')。hide();

location.reload();

}其他{

$('#progress')。hide();

$('#myModalContent')。html(result);

bindForm() ;

}

}

});

返回false;

} );

}

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;
});
}

推荐答案

('#CreateAssets')。ajaxForm(function(){

} );





保存数据后,我们使用json返回true。

返回Json(new {s uccess = true});



请使用Boostrap模态弹出窗口建议如何在数据库中保存图像。





以下是JS文件,用于打开和保存模态弹出窗口


('#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() {
(function () {


.ajaxSetup({cache:false});
.ajaxSetup({ cache: false });


这篇关于Boostrap Modal弹出窗口中的FileUpload的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆