3

我有一个带有表单的创建视图。它有一个输入文本（环境）、输入文件（徽标）下拉列表（平台）和视图模型列表（天）。

这工作正常。现在我想添加一个“动态字段”来插入文件。典型的添加文件、删除文件。我已经看到这是通过淘汰赛完成的。我的问题是如何处理 HttpPostedFileBase 和淘汰赛，最糟糕的是，列出 HttpPostedFileBase 和淘汰赛。

我已经这样做了，但它不起作用。任何帮助将不胜感激。

创建视图：

@model HPRWT.ViewModels.ReportViewModel

<script src="http://code.jquery.com/jquery-latest.js" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/knockout-2.1.0.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/knockout.namepathbinding.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/Files.js")" type="text/javascript"></script>

@using (Html.BeginForm("Create", "Service", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
    @Html.ValidationSummary(true)
    <fieldset>
        <legend>Report</legend>

        <div class="editor-label">
            @Html.LabelFor(model => model.Enviroment)

            @Html.EditorFor(model => model.Enviroment, new { data_bind = "value: enviroment" })
            @Html.ValidationMessageFor(model => model.Enviroment)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.Logo)
            @Html.TextBoxFor(model => model.Logo, new { type = "file", data_bind = "value: logo" })
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.PlatformID)
            @Html.DropDownListFor(model => model.PlatformID, Model.Platforms.Select(f => new SelectListItem { Text = f.name, Value = f.ID.ToString() })) 
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.InputFiles)
            @for (int j = 0; j < Model.InputFiles.Count; j++)
            {
                @Html.TextBoxFor(model => model.InputFiles[j], new { type = "file", data_bind = "value: inputFile"  })
            }
            <button data-bind="click: addFile">Add Log</button>
            <button data-bind="click: removeFile">Remove Log</button>
        </div>

        <table id="hours">
            @for (int i = 0; i < 7; i++)
            {
                <tr>
                    <td>@Model.Days[i].Label</td>
                    @for (int j = 0; j < 24; j++)
                    {
                        <td><div>@Html.CheckBoxFor(model => model.Days[i].Hours[j].Selected)@Html.LabelFor(model => model.Days[i].Hours[j].Selected, @" ")</div></td>
                    }
                </tr>
            }
        </table>

        <p>
            <input type="submit" value="Create" />
        </p>
    </fieldset>
}

文件.js

function createViewModel() {

    var createFile = function () {
        return {
            inputFile: ko.observable()
        };
    };

    var addFile = function () {
        inputFiles.push(createFile());
    };

    var removeFile = function () {
        inputFiles.pop();
    };

    var enviroment = ko.observable();
    var logo = ko.observable();
    var inputFiles = ko.observableArray();

    return {
        enviroment: enviroment,
        logo: logo,
        inputFiles: inputFiles,
        addFile: addFile,
        removeFile: removeFile
    };

}

$(document).ready(function () {
    var viewModel = createViewModel();
    ko.applyBindings(viewModel);
});

报告视图模型：

public class ReportViewModel
    {

        public int ID { get; set; }
        public IEnumerable<Platform> Platforms { get; set; }
        public int PlatformID { get; set; }
        public string Enviroment { get; set; }
        public HttpPostedFileBase Logo { get; set; }
        public IList<HttpPostedFileBase> InputFiles { get; set; }
        public IList<DayViewModel> Days { get; set; }


        public ReportViewModel()
        {
            Days = Enumerable.Range(1, 7).Select(day => new DayViewModel { Value = day }).ToList();
            InputFiles = new List<HttpPostedFileBase>();
        }

    }

日视图模型：

public class DayViewModel
    {

        public int Value { get; set; }    
        public virtual IList<HourViewModel> Hours { get; set; }

        public DayViewModel()
        {
            Hours = Enumerable.Range(0, 24).Select(hour => new HourViewModel { Value = hour }).ToList();
        }

    }

小时视图模型：

public class HourViewModel
{
    public int Value { get; set; }
    public bool Selected { get; set; }
}
4

1 回答 1

0

尝试制作InputFiles数组而不是 IList

我不确定 IList，但是当您将属性作为 List 时，您必须将 html 字段名称保留为 fieldlist.propname。index（并且Id将是 fieldlist_propname_ index），其中您的索引将从默认或第一个字段的 0 开始，当您添加新控件时，它的名称应该像 fieldlist.propname 一样递增。0（第一个）然后是 fieldlist.propname。1依此类推...然后只有模型绑定器才能绑定。

如果它有效，最好尝试使用 Array，那么我认为你很好

于 2015-11-27T10:23:03.733 回答