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>
}

Files.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);
});

ReportViewModel:

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>();
        }

    }

DayViewModel:

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();
        }

    }

HourViewModel:

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

1 に答える 1

0

IList の代わりにInputFiles Array を作成してみてください

IListについてはわかりませんが、プロパティをリストとして取得する場合、htmlフィールドをfieldlist.propnameのままにしておく必要があります。index (およびIdは fieldlist_propname_ indexになります)。ここで、インデックスはデフォルトまたは最初のフィールドの 0 から開始し、新しいコントロールを追加すると、その名前は fieldlist.propname のように増分されます。0 (最初のもの) 次に fieldlist.propname。1など... この場合、モデル バインダーのみがバインドできます。

それが機能する場合は、Array を試してみてください。

于 2015-11-27T10:23:03.733 に答える