2015-07-01 4 views
1

У меня есть следующий ViewModel, который я заполняю некоторыми предопределенными данными. Одной из этих предопределенных данных является список параметров ViewPod Parameter, которые первоначально отображают n номеров ApplicationParameters.Добавление динамически добавленных элементов управления в ViewModel

То, что я хотел достичь, - это позволить пользователю добавлять дополнительное число ViewModels ApplicationParameters на кнопку, которую я достиг, вызвав PartialView с кодом ApplicationParameter. Поскольку ожидаемые элементы управления автоматически добавляются, но они не распознаются в ViewModel, поскольку у них нет правильного наименования (поскольку они вложены).

Что делать, чтобы сделать динамически добавленные элементы управления видимыми для ViewModel, возвращаемых в POST.

ViewModels

public class ApplicationVM 
{ 

    public int idApplication { get; set; } 
    public int idCompany { get; set; } 
    public string Company { get; set; } 
    public string Name { get; set; } 
    public string Description { get; set; } 
    public string Link { get; set; } 
    public string Photo { get; set; } 

    public List<ApplicationParameterVM> ApplicationParameters { get; set; } 
} 

public class ApplicationParameterVM 
{ 
    public string Name { get; set; } 
    public bool Keep { get; set; } 
} 

вид Действие (фрагмент кода)

<tbody id="editorRows"> 
    @for (int i = 0; i < Model.ApplicationParameters.Count(); i++) 
     { 
      <tr> 
       <td> 
        @Html.TextBoxFor(m => Model.ApplicationParameters[i].Name, new { @class = "form-control" }) 
        @Html.CheckBoxFor(m => Model.ApplicationParameters[i].Keep) 
        </td> 
       </tr> 
      } 
    </tbody> 

вид Действие для добавления ApplicationParameterVM

@model AccessMarketmind.Areas.Administration.ViewModels.ApplicationParameterVM 
    @{ 
     Layout = null; 
    } 

<tr class="application-parameters"> 
    <td> 
     @Html.TextBoxFor(m => Model.Name, new { @class = "form-control" }) 
     @Html.CheckBoxFor(m => Model.Keep) 
    </td> 
</tr> 

Я знаю, что это выглядит тривиально и может быть легко сделано с помощью Javascript, но дело в том, что у меня есть более сложные ViewModels (читайте: сильно вложенные), в которых Javascript не является вариантом.

+0

Я не понимаю, почему вам все еще нужно «Вид действия для добавления ApplicationParameterVM». – Sravan

+0

@Sravan Возможно, я был недостаточно ясен, действие используется для создания ApplicationVM. Поскольку ApplicationParameters являются частью ViewModel, я нуждаюсь в них в своих действиях. Короче говоря, я пропустил ненужный код. –

+1

Вам необходимо использовать вспомогательный помощник [BeginCollectionItem] (https://github.com/danludwig/BeginCollectionItem) или для поддержки с чистой стороны на стороне клиента [см. Этот ответ] (http://stackoverflow.com/questions/29837547/ set-class-validation-for-dynamic-textbox-in-a-table/29838689 # 29838689) –

ответ

0

После полезных ответов я смог получить то, что работает точно так, как я хотел. То, что я сделал, представляет собой комбинацию кода сервера и клиента, и идея состоит в том, чтобы в основном добавить дополнительное свойство в ViewModel, которое я назвал ControlName и имеет строку типа. Что отличает вас от этого, что если ваши изменения в ViewModel могут быть легко изменены, вы можете легко настроить код на текущие потребности с чрезмерным количеством хлопот, не говоря уже о том, что вы можете легко перейти на несколько уровней глубины, просто добавив свойство ControlName на каждый подуровень ViewModel.

Примечания: Следующий пример не один упоминается в OP

Сначала вам нужно какое-то обертки (в моем случае таблица) и ссылка, которая позволит вам создать новые ряды управления:

 @Html.ActionLink("Add attribute", "AddProductCategoryAttribute", null, new { id = "addProductCategoryAttribute" }) 
     <table class="table table-condensed table-striped"> 
      <thead> 
       <tr> 
        <th> 

        </th> 
        <th> 
         Attribute 
        </th> 
        <th> 
         Measure 
        </th> 
       </tr> 
      </thead> 
      <tbody id="productCategoryAttributes"></tbody> 
     </table> 

на стороне клиента вам нужно что-то вроде этого

<script type="text/javascript"> 
    $("#addProductCategoryAttribute").click(function() { 
     elementCount = $(".productCategoryAttribute").length; 

     $.ajax({ 
      url: this.href + "?elementCount=" + elementCount, 
      cache: false, 
      success: function (html) { 
       $("#productCategoryAttributes").append(html); 
      } 
     }); 
     return false; 
    }) 
</script> 

Примечание прилагаемой elementCount по ссылке - этот запрос используется, чтобы метод Action знал, сколько элементов уже существует. Говоря о методе Action, вот как это выглядит сейчас.

public ActionResult AddProductCategoryAttribute(int elementCount) 
    { 
     ProductCategoryOverview.ProductCategoryAttributeVM productCategoryAttributeVM = new ProductCategoryOverview.ProductCategoryAttributeVM(); 
     productCategoryAttributeVM.ControlName = "ChangeThisNameToWhateverIsNeeded[" + elementCount.ToString() + "]."; 
     productCategoryAttributeVM.Keep = true; 

     return View(productCategoryAttributeVM); 
    } 
1

Основной взлом в этих динамических формах состоит в том, что данные формы, которые отправляются, должны соответствовать именам свойств.

Ex: конечные имена свойств вашего динамического массива управления должны быть. ApplicationParameters [0] .Name и ApplicationParameters [0] .Keep и
ApplicationParameters [1] .Name и ApplicationParameters [1] .Keep .....

Для достижения этой цели, пожалуйста, используйте слабосвязанной помощника Только Html.TextBox().

+0

Я не думаю, что смогу получить данные в сообщении с кодом, поскольку ApplicationParameters являются частью модели представления приложений. Кроме того, подзапрос, что, если у нас многоуровневое вложение - в этом случае он идет только на один уровень, но что, если бы у нас было Application.ApplicationParameter [0] .ApplicationParameterValue.Foo –

+0

Он будет работать на всех уровнях как таковой, если у вас есть надлежащее свойство имена в должности. Попробуйте отправить данные и проанализировать данные формы. – Sravan

+0

Я создал образец под рукой. – Sravan

Смежные вопросы