0

我需要知道是否在 Jasny Bootstrap 中删除了图像。我的保存和删除代码效果很好。问题是知道何时未设置图像,因为文件上传图像仅在存在时才转换为 HttpPostedFileBase。

班级:

    [NotMapped]
    public HttpPostedFileBase Image { get; set; }

编辑视图:

@using (Html.BeginForm("Edit", "MyObject", FormMethod.Post, new { enctype = "multipart/form-data" })) {
    <div class="field">
        <div class="fileinput @imageClass" data-provides="fileinput" data-name="Image">
        <div class="fileinput-new thumbnail" style="width: 150px; height: 150px;">
        <img src="@MyNamespace.Components.S3Utility.DefaultImageUrl">
     </div>
     <div class="fileinput-preview fileinput-exists thumbnail" style="max-width: 350px; max-height: 350px;">
         <img src="@imageUrl">
     </div>
     <div>
         <span class="btn btn-default btn-file">
             <span class="fileinput-new">Select image</span>
             <span class="fileinput-exists">Change</span>
             <input type="file" name="Image">
         </span>
         <a href="#" class="btn btn-default fileinput-exists" data-dismiss="fileinput">Remove</a>
    </div>
}

保存代码:

if (data.Image == null) {
    S3Utility.Delete(myObject.Id);
} else {
    S3Utility.Upload(data.Image, myObject.Id);
}

所有这些工作正常。如果有正确的图像(@imageUrl,我正在设置),它甚至会加载图像。

问题是 'Image' HttpPostedFileBase 在更新时始终为空。

有什么方法可以知道图像是否已被删除或设置?在 Jasny 中设置/删除图像时是否更新了该值?

我看到了这个帖子

http://www.jasny.net/articles/jasny-bootstrap-file-upload-with-existing-file/

但它没有转化为 Asp.Net MVC 4 和 HttpPostedFileBase。

4

1 回答 1

0

好的,所以答案很简单。在对象中我添加了另一个属性

[NotMapped]
public bool ExistingImage { get; set; }

在我的编辑视图中,仅当图像确实存在时,我才为 ExistingImage 添加了一个隐藏字段

编辑视图:

@using (Html.BeginForm("Edit", "MyObject", FormMethod.Post, new { enctype = "multipart/form-data" })) {
    <div class="field">
        <div class="fileinput @imageClass" data-provides="fileinput" data-name="Image">
        <div class="fileinput-new thumbnail" style="width: 150px; height: 150px;">
        <img src="@MyNamespace.Components.S3Utility.DefaultImageUrl">
     </div>
     <div class="fileinput-preview fileinput-exists thumbnail" style="max-width: 350px; max-height: 350px;">
         <img src="@imageUrl">
         // THIS IS THE NEW CODE FOR CHECKING EXISTING IMAGE
         @if (existingImage) {
             <input type="hidden" name="ExistingImage" value="true" />
         }
         // END NEW CODE
     </div>
     <div>
         <span class="btn btn-default btn-file">
             <span class="fileinput-new">Select image</span>
             <span class="fileinput-exists">Change</span>
             <input type="file" name="Image">
         </span>
         <a href="#" class="btn btn-default fileinput-exists" data-dismiss="fileinput">Remove</a>
    </div>
}

然后在保存中我只是检查它是否是现有图像:

if (!data.ExistingImage) {
    if (data.Image == null) {
        S3Utility.Delete(myObject.Id);
    } else {
        S3Utility.Upload(data.Image, myObject.Id);
    }
}

我的问题是不了解 .fileinput-exists 部分的工作原理。当您删除或更新图像时,它实际上会删除该部分中的所有内容。因此,如果在 Jasny 中调用了 remove 或 update get,ExistingImage 将默认为 false。那时我只是检查 Image 是否为空(已删除或不存在)或是否存在(已更新)。如果图像不存在,这确实会调用 S3 的额外删除,但这没什么大不了的(出于我的目的)。

于 2014-04-17T00:12:13.303 回答