我正在尝试将图像上传到我的应用程序,但它总是返回 null。我在这里找不到问题。你能帮我吗?这是我的代码。
模型
[Table("Slider")]
public partial class Slider : BaseModel
{
[Required]
[StringLength(200)]
public string FileName { get; set; }
[StringLength(200)]
public string Title { get; set; }
[StringLength(1000)]
public string Description { get; set; }
public int? Order { get; set; }
}
[NotMapped]
public class SliderImage : Slider
{
public HttpPostedFileBase ImageFile { get; set; }
}
看法
@using (Html.BeginForm(null, null, FormMethod.Post, new { enctype = "multipart/form-data" }))
{
@Html.AntiForgeryToken()
<div class="modal-body">
<div class="form-horizontal">
@Html.ValidationSummary(true, "", new { @class = "text-danger" })
@Html.HiddenFor(model => model.Id)
<div class="form-group">
@Html.LabelFor(model => model.FileName, new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.TextBoxFor(model => model.FileName, new { @class = "form-control", @readonly = "readonly" })
@Html.ValidationMessageFor(model => model.FileName, "", new { @class = "text-danger" })
</div>
</div>
<div class="form-group">
@Html.LabelFor(model => model.ImageFile, new { @class = "control-label col-md-2" })
<div class="col-md-10">
@Html.TextBoxFor(m => m.ImageFile, new { @class = "form-control", type = "file" })
//This is Same as below
//<input class="form-control" id="ImageFile" name="ImageFile" type="file" value="">
</div>
</div>
控制器
public ActionResult Edit(int id)
{
Slider slider = _db.Sliders.Find(id);
if (slider == null)
{
return HttpNotFound();
}
Mapper.CreateMap<Slider, SliderImage>();
SliderImage sliderImage = Mapper.Map<Slider, SliderImage>(slider);
return PartialView("_Edit", sliderImage);
}
[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult EditSlider([Bind(Include = "Id,FileName,Title,Description,Order,IsActive,Name,ImageFile")] SliderImage sliderImage)
{
if (ModelState.IsValid)
{
Mapper.CreateMap<SliderImage, Slider>();
Slider slider = Mapper.Map<SliderImage, Slider>(sliderImage);
_db.Entry(slider).State = EntityState.Modified;
_db.SaveChanges();
return Json(new { success = true });
}
return PartialView("_EditSlider");
}
我做错了什么?
发现问题
我在引导模式弹出窗口中绑定部分视图。当我从弹出窗口上传时,上传返回 null。相反,如果我直接在浏览器中打开部分视图,则该文件存在于模型中。所以文件上传没有问题。问题出在模态弹出窗口之类的东西上。
使用 Bootstrap 模型时
使用部分 View Directy 时
分别查看下图中Bootstrap Modal Submit和Using the partial View Directly使用fiddler时发现的区别
从模式弹出窗口发布时,内容类型更改为application/x-www-form-urlencoded
直接使用局部视图时的位置multipart/form-data
找到了根本问题。
$('form', dialog).submit(function () {
var $form = $(this);
var enctype = $form.attr('id');
$.ajax({
url: this.action,
type: this.method,
data: $(this).serialize(),
success: function (result) {
if (result.success) {
$('#myModal').modal('hide');
//Refresh
location.reload();
} else {
$('#myModalContent').html(result);
bindForm();
}
}
});
return false;
});
我正在使用 AJAX 发布从我的表单提交数据。使用$(this).serialize()
ajax 时成功调用但文件没有返回,因为内容类型不同。我怎样才能改变这个?