Question

我有以下控制器方法来检索文件夹中的文件。

    public JsonResult filesinfolder(ProductEdit model)
    {
        string productid = "01";

        string salesFTPPath = "C:/Users/user/Documents/Visual Studio 2015/Projects/rootProject/project_name/project_name/Content/Essential_Folder/marketing_materials_EN/01";
        DirectoryInfo salesFTPDirectory = new DirectoryInfo(salesFTPPath);
        IEnumerable<string> files = salesFTPDirectory.GetFiles()
          .Where(f => f.Extension == ".xls" || f.Extension == ".xml" || f.Extension == ".jps" || f.Extension == ".jpg" || f.Extension == ".jpeg" || f.Extension == ".png" || f.Extension == ".PNG")
          .OrderBy(f => f.Name)
          .Select(f => f.Name);

        // build urls
        model.ImageUrls = new List<string>();

        foreach (string name in files)
        {
            model.ImageUrls.Add(Url.Content("~/Content/Essential_Folder/marketing_materials_EN/" + productid) + "/" + name);
        }

        return Json(model, JsonRequestBehavior.AllowGet);
    }

然后在视图页面中，我使用以下标签和脚本显示这些文件

<li id="idd"></li>

脚本

$(document).ready(function () {
    $.ajax({
        type: 'GET',
        url: '@Url.Action("filesinfolder", "Home")', // don't hardcode
        dataType: "json",
        success: function (data)
        {
            $.each(data, function (index, item) {
                var img = $('<img>').attr('src', item);
                $("#idd").append(img);
            });
        },
        error: function (xhr, status, err) {
        }
    });
});

但是使用这个我只能在这个特定文件夹有一个文件的情况下进行预览，当它出现在文件夹中的多个文件时，这些文件没有在Viewpage中预览

Answer 1

更改您的实现以迭代data.ImageUrls作为Controller操作返回包装imageUrls的模型对象。

$(document).ready(function () {
    $.ajax({
        type: 'GET',
        url: '@Url.Action("filesinfolder", "Home")', // don't hardcode
        dataType: "json",
        success: function (data)
        {
            $.each(data.ImageUrls, function (index, item) {
                var img = $('<img>').attr('src', item);
                $("#idd").append(img);
            });
        },
        error: function (xhr, status, err) {
        }
    });
});

视图中未显示多个图片

1 个答案: