Checkbox'ların Görünümüne ve Çıkışına Gözat IEnumerable

Question

Bir kullanıcıyla ilişkilendirilecek öğeler listesi var. Bire-bir ilişki var. Öğelerin listesinin tümünün kendilerine ilişkilendirilmemiş olanlardan seçebilmelerini (ve ayrıca ilişkili olanları da görebilmeleri için) görüntülemesini istiyorum. Bunlardan onay kutuları oluşturmak istiyorum. Ardından, seçili olanları ilişkilendirilecek kontrol cihazına geri göndermek istiyorum. Henüz ilişkilendirilmemiş olanlar da dahil olmak üzere hepsinin listesinden nasıl geçebilirim ve ilişkilendirilmek üzere güvenilir bir şekilde tekrar iletebilirim?

İlk önce denediğim şey şu; ancak bu girdiler, girdilerden, öğenin Kullanıcı'nın kendisiyle hiçbir bağlantısı olmayan AllItems koleksiyonu aracılığıyla aktarılan öğelerden temel aldığım için işe yaramayacağı açıktır.

<div id="item-list"> 
    @foreach (var item in Model.AllItems) 
    { 
     <div class="ui field"> 
      <div class="ui toggle checkbox"> 
       <input type="checkbox" id="item-@item.ItemID" name="Items" value="@item.Active" /> 
       <label for="item-@item.ItemID">@item.ItemName</label> 
      </div> 
     </div> 
    } 
</div> 

Answer 1

foreach döngüsünü kullanarak bir koleksiyona bağlanamazsınız. Ayrıca, html'nizi manuel olarak oluşturmamanız da gerekir; bu durumda, denetlenmeyen onay kutuları geri gönderilmediği için işe yaramaz. Her zaman güçlü yazılan html yardımcılarını kullanın, böylece 2 yönlü modelin doğru şekilde bağlanmasını sağlayın.

Sen modelleri nelerdir belirtilen ama teşekkür varsayarak değil

bir User varsa ve görünümde görüntülemek istediğinizi temsil etmek görünüm modellerini sonra, bu kullanıcı için Roles seçmek oluşturmak istiyorum

public class RoleVM 
{ 
    public int ID { get; set; } 
    public string Name { get; set; } 
    public bool IsSelected { get; set; } 
} 
public class UserVM 
{ 
    public UserVM() 
    { 
    Roles = new List<RoleVM>(); 
    } 
    public int ID { get; set; } 
    public string Name { get; set; } 
    public List<RoleVM> Roles { get; set; } 
} 

yılında GET yöntemi

public ActionResult Edit(int ID) 
{ 
    UserVM model = new UserVM(); 
    // Get you User based on the ID and map properties to the view model 
    // including populating the Roles and setting their IsSelect property 
    // based on existing roles 
    return View(model); 
} 

Görünüm

@model UserVM 
@using(Html.BeginForm()) 
{ 
    @Html.HiddenFor(m => m.ID) 
    @Html.DisplayFor(m => m.Name) 
    for(int i = 0; i < Model.Roles.Count; i++) 
    { 
    @Html.HiddenFor(m => m.Roles[i].ID) 
    @Html.CheckBoxFor(m => m.Roles[i].IsSelected) 
    @Html.LabelFor(m => m.Roles[i].IsSelected, Model.Roles[i].Name) 
    } 
    <input type"submit" /> 
} 

Ardından sonrası yönteminde, modeliniz bağlı olacaktır ve bunu madde dizinlerine geçer gibi bu çalışır, ancak her öğenin gerçek değeri null

[HttpPost] 
public ActionResult Edit(UserVM model) 
{ 
    // Loop through model.Roles and check the IsSelected property 
} 

Answer 2

Bu problemi çözmek için çok daha kolay hale getiren, onay kutularını dinamik olarak silmeniz gibi görünmüyor. Not: istemcinin artık sıralı olmayacağından istemciler veya komut dosyalarının sayfadan onay kutularını dinamik olarak kaldırmasına izin verirseniz, aşağıdaki çözüm beklendiği gibi çalışmaz.

MVC model bağlaması kusursuz değildir, bu nedenle bazen yardımcı olmanız gerekir. Model binder, Items adında bir özelliğe bağlanması gerektiğini bilir çünkü giriş alanının adı Öğeler'dir, ancak Öğelerin bir liste olduğunu bilmez. Yani, kontrolörünüzde varsayarak, ihtiyacınız olan şeyleri bir araya getirmek için bir öğe listesi vardır. Yapmanız gereken şey, MVC'nin bir listeye bağlandığınızı tanımasıdır. Bunu yapmak için listenin adını ve bir endeksi belirtin.

<input type="checkbox" id="item-@Model.AllItems[i].ItemID" name="Items[@i]" value="@Model.AllItems[i].Active" />

Bildirim Öğeler [@i]:

<div id="item-list"> 
    @for (var i = 0; i < Model.AllItems.Count; i++) 
    { 
     <div class="ui field"> 
      <div class="ui toggle checkbox"> 
       <input type="checkbox" id="item-@Model.AllItems[i].ItemID" name="Items[@i]" value="@Model.AllItems[i].Active" /> 
       <label for="item-@Model.AllItems[i].ItemID">@Model.AllItems[i].ItemName</label> 
      </div> 
     </div> 
    } 
</div> 

Burada anahtar hat

bu nedir? Bu, model ciltleyicisine Öğeler adlı bir özellik aramasını ve bu değeri Öğeler için i'de dizine eklemesini söylüyor.