SelectListBoxに複数の項目をあらかじめ選択してください

Question

タイトルには、ビューが読み込まれるときにアイテムを事前に選択したいと述べています。私はこのコードを持っている：私は、ページをロードするとき、それは項目を事前に選択しませんしかし

"1", "Category 1", true 
"2", "Category 2", false 
"3", "Category 3", false 
"4", "Category 4", false 
"5", "Category 5", true 

：

@{ 
    var categoryList = new List<SelectListItem>(); 
    foreach (var category in ViewBag.Categories) 
    { 
     categoryList.Add(new SelectListItem 
     { 
      Value = category.CategoryId.ToString(), 
      Text = category.Name, 
      Selected = category.Assigned 
     }); 
    } 
} 
@Html.ListBox("Categories", categoryList, new { @class = "select-toggle", size = 5 }) 

。これは大まかとして出力されます。私は異なるフォーマットのようないくつかの可能な解決策を試して、モデルからカテゴリを選択していますが、私の場合は動作しないようです。何か案は？

Answer 1

私はビューとアクションメソッドの間でデータを転送するためにビューモデルを使用することを個人的に好みます（投稿されたフォームの値を表示してアクションメソッドに戻すためにデータをロードすること）。では、ビューモデルを作成してこの問題を解決しましょう。

public class CreateProductVm 
{ 
    public int ID { set;get;} 
    public string Name { set;get;} 
    public List<SelectListItem> Categories { set;get;} 
    public int[] SelectedCategories { set;get;} 
    //Add other properties as needed by the view 
} 

は、今すぐあなたのGETのアクションメソッドでは、我々は、このビューモデルのオブジェクトを作成Categoriesプロパティをロードし、ビューにそのオブジェクトを送信します。リストボックス内のいくつかの項目をあらかじめ選択する場合は、SelectedCategoriesプロパティをロードできます。今すぐあなたのビューが強くフォームが送信されたときに今、あなたはあなたの方法を想定し、あなたのHttpPostアクションで選択したカテゴリを取得するためにSelectedCategoriesプロパティを読み取ることができ、当社のビューモデル

@model CreateProductVm 
@using(Html.BeginForm()) 
{ 
    @Html.TextBoxFor(s=>s.Name) 
    @Html.HiddenFor(g=>g.Id) 
    @Html.ListBoxFor(x=>x.SelectedCategories ,Model.Categories) 
    <input type="submit" /> 
} 

に型付けされます

public ActionResult Edit(int id) 
{ 
    //get the Product from db using id and assign to the properties of our view model 
    var vm = new CreateProductVm(); 
    // Hard coded items for demo. You may replace with data from your db table(s) 
    vm.Categories = new List<SelectListItem> { 
              new SelectListItem { Value="1", Text="Books"}, 
              new SelectListItem { Value="2", Text="Toys"}, 
              new SelectListItem { Value="3", Text="Phone"}, 
              new SelectListItem { Value="4", Text="Cars"} 
    }; 
    vm.SelectedCategories = new[] {2, 3}; // To preselect Toys & Phone 
    return View(vm); 
} 

パラメータとしてCreateProductVmクラスのオブジェクトを取ります。

[HttpPost] 
public ActionResult Edit(CreateProductVm model) 
{ 
    //check for model.SelectedCategories; 
    var p =db.Products.FirstOrDefault(s=>s.Id==model.Id); 
    if(p!=null) 
    { 
    p.Name = model.Name; 
    //Update other properties as needed 
    db.SaveChanges(); 
    return RedirectToAction("Index"); 
    } 
    // to do : return something 
} 

Answer 2

私は以下を試しました。そしてそれは正常に動作するようです。

@{ 
var categoryList = new List<SelectListItem>() 
        { 
         new SelectListItem() 
         { 
          Value = "1", 
          Text = "One", 
          Selected = true 
         }, 
         new SelectListItem() 
         { 
          Value = "2", 
          Text = "Two", 
          Selected = false 
         }, 
         new SelectListItem() 
         { 
          Value = "3", 
          Text = "Three", 
          Selected = true 
         } 
        }; 

} 
@Html.ListBox("Categories", categoryList, new { @class = "select-toggle", size = 5 }) 

あなたの出力についてよろしいですか？たぶんこの例で試してみてください。