2013-06-10 7 views
3

У меня есть вид на представление с формой. Он содержит входной текст (enviroment), выпадающий список входных файлов (логотип) (платформы) и список viewmodel (дней).Список HttpPostedFileBase с нокаутом

Это работает нормально. Теперь я хочу добавить «динамическое поле» для вставки файлов. Типичный файл добавления, удаление файла. Я видел, как это делается с нокаутом. Моя проблема заключается в том, как иметь дело с HttpPostedFileBase и нокаутом, а хуже всего - список HttpPostedFileBase и нокаут.

Я сделал это, но это не работает. Любая помощь будет очень оценена.

CreateView:

@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; } 
} 
+0

вы пытаетесь отобразить файл с помощью нокаута или пытаетесь загрузить файл? –

ответ

0

Try делая InputFiles массива вместо IList

Я не уверен, что IList, но если принять имущество в виде списка, вы должны сохранить html-поле имя как fieldlist.propname. indexId будет fieldlist_propname_ ) индекс), где индекс будет начинаться с 0 для поля по умолчанию или первого поля, а когда вы добавите новый элемент управления, его имя должно получить прирост, например, fieldlist.propname. (первый), а затем fieldlist.propname. и т. Д. ... тогда только связующее устройство сможет связывать.

Лучше попробовать с массивом, если он работает, то я думаю, что вы хорошо идти