0

我有一组用户在我们的ASP.NET MVC应用程序中上传的图像。

用户上传图片后，我将图片保存在 Web UI 项目的 content/images 文件夹中，并将文件名填充到 List 中，然后在partial view.

我不确定为什么图像没有呈现，但以下是我的代码：

看法

<div class="bodyContent">
    @if (Model.RunEntryImagesDisplay != null && Model.RunEntryImagesDisplay.Count() > 0)
    {
        <span class="leftContent">
            @Html.Label("Images")
        </span><span class="rightContent"><span id="ImagesChildDialogLink" class="treeViewLink">
            Click here to View Images </span>
            <br />
            <span id="ImagesDisplayy"></span></span>
    }
</div>
<div id="Imagestreeview" title="Dialog Title" style="font-size: 10px; font-weight: normal;
    overflow: scroll; width: 800px; height: 450px; display: none;">
    @if (Model.RunEntryImagesDisplay != null && Model.RunEntryImagesDisplay.Count() > 0)
    {
        @Html.EditorFor(x => x.RunEntryImagesDisplay)
    }
</div>

编辑器模板

@model RunLog.Domain.Entities.RunLogEntryImagesDisplay
@Html.DisplayFor(x => x.FileStoredName, new { style = "width: 200px; height: 100px;" })
@Html.HiddenFor(x => x.FileStoredName)
@Html.DisplayFor(x => x.FileName, new { style = "width: 200px; height: 100px;" })
@Html.HiddenFor(x => x.FileName)
@Html.CheckBoxFor(x => x.Checked)
@Html.HiddenFor(x => x.Checked)
@Html.DisplayFor(x => x.FileExtension, new { style = "width: 200px; height: 100px;" })
@Html.HiddenFor(x => x.FileExtension)
<img src="@Url.Action("Image", Model.FileStoredName)" alt="Image" />

JS 模态框

$(document).ready(function () {

    $('#ImagesChildDialogLink').click(function () {

        initImagesDailog();
    });


    function initImagesDailog() {
        var PartDialog;
        PartDialog = $("#Imagestreeview").dialog({ autoOpen: true, modal: false, resizable: true, draggable: true,
            stack: false, title: 'Parsed Test Exceptions', width: 1000, height: 400, buttons: { Close: function () {
                var btnText = '';
                $('.ui-dialog-buttonpane :button').each(function () {
                    if ($(this).text() == 'Close') {
                        btnText = 'Close';
                        $(this).text('Close');
                    }
                });
                if (btnText == 'Close') {
                    PartDialog.dialog("close");
                }
            }
            }
        });

        PartDialog.closest("div.ui-dialog").appendTo("#form");
    }

});

渲染图像的控制器动作

公共动作结果图像（字符串文件）{

    //byte[] image = 
    string loadLististFileName = file;
    string fileNamePath = loadLististFileName;
    string fileName = Path.GetFileName(fileNamePath);
    string dirName = Path.GetDirectoryName(fileNamePath);

    var fileData = IOHelper.GetFileImageData(fileName, dirName);

    return File(fileData, "image/jpg");
}



public static byte[] GetFileImageData(this string fileName, string filePath)
{
    var fullFilePath = string.Format("{0}/{1}", filePath, fileName);
    if (!File.Exists(fullFilePath))
        throw new FileNotFoundException("The file does not exist.", fullFilePath);
    return File.ReadAllBytes(fullFilePath);
}

编辑

我搞定了，我的编辑器模板名称与模型 List 属性的名称不同。我什至不需要使用动作图像来显示。刚刚使用了图像源标签。

4

1 回答 1

0

我让它工作，我的编辑器模板，cshtml的名称与模型列表属性的名称不同。我什至不需要使用动作图像来显示。刚刚使用了图像源标签，它就像一个魅力。现在我将使用一个图片库插件，通过缩略图和所有这些好东西让它变得漂亮。MVC 是如此触手可及。

于 2013-10-01T05:27:38.150 回答