web-dev-qa-db-ja.com

DropDownListデータを含むASP.NET MVC 4 ViewModel

@html.EditorForを使用して編集モードでモデルをレンダリングしていますが、ドロップダウンリストがレンダリングされません。

これが私のViewModelです:

     public class RiskAutoViewModel
     {
       public RiskAutoViewModel()
       {
         VehicleMakeList = new SelectList(new List<VehicleMake>() { new VehicleMake() { Id = 1, Name = "Renault" }, new VehicleMake() { Id = 2, Name = "Peugeot" } });
       }


    public int NoClaimsDegree { get; set; }

    public int VehicleValue { get; set; }

    public int EngineCapacity { get; set; }

    public int VehicleMake { get; set; }

    public SelectList VehicleMakeList { get; set; }
  }

VehicleMaketextboxとしてレンダリングされ、VehicleMakeListはまったくレンダリングされません。私が望むのは、VehicleMakeのリストを含むドロップダウンリストをレンダリングし、その値をVehicleMakeのいずれかに設定することです。

モデルが保存されると、VehicleMakeはリストで選択された項目の値に設定されます。

どうやってやるの ?

[〜#〜]編集[〜#〜]

下のコメントボックスにはコードを入力できないため、ここにフォローアップを記述します。

次のようなEditorTemplateを作成しました。

<div class="editor-label">
    @Html.LabelFor(model => model.VehicleMakeList)
</div>
<div class="editor-field">
    @Html.DropDownListFor(model => model.VehicleMake, Model.VehicleMakeList)
    @Html.ValidationMessageFor(model => model.VehicleMake)
</div>

そして今私のViewModelは次のようになります:

[Required]
[ScaffoldColumn(false)]
public int VehicleMake { get; set; }

[Display(Name = "Marque", Prompt = "Marque", Description = "Renseigne la marque du véhicule")]
public SelectList VehicleMakeList { get; set; }

今、これは私に別の質問を導きます(多分別のスレッドのようにすべきです)が、実際にはそのビューに2つのドロップダウンがあります。また、2番目のドロップダウンの項目は基本的に動的であり、最初のドロップダウンで選択した項目に依存します。これは、AJAXを使用すると簡単に実行できますが、MVCを使用すると失われます。人々は通常、どうやってそれを行うのですか?

9
Sam

残念ながら、テンプレートのエディターにはドロップダウンリストのサポートが組み込まれていません。独自のエディターテンプレートを作成するか、ビューでHTMLヘルパーメソッド@Html.DropDownListFor()を使用できます。

Darin Dimitrovの この質問 への答えは、もし気が向いていれば、ドロップダウンリスト用のエディターテンプレートを構築するプロセスを説明します。

これを機能させる最も速い方法は、あなたの見解でこれを行うことです:

@Html.EditorFor(model => model.NoClaimsDegree)
@Html.EditorFor( model => model.VehicleValue )
@Html.EditorFor( model => model.EngineCapacity )
@Html.DropDownListFor( model => model.VehicleMake, Model.VehicleMakeList, "Select a make" )
10
Forty-Two

ドロップダウンリストのモデルは次のようになるはずです。

public List<System.Web.Mvc.SelectListItem> VehicleMakeList {get; set;}

そして次のように初期化されます:

VehicleMakeList = new List<System.Web.Mvc.SelectListItem>() 
{ 
   new SelectListItem { Value = "1", Text = "Renault" }, 
   new SelectListItem { Value = "2", Text = "Peugeot" } 
};

またはデータソースを使用する:

    VehicleMakeList = db.VehicleMakers /*EF, LINQ2SQL, ADO.NET or any supported external source*/
       .Select(v=> new SelectListItem { Text = v.Name, Value = v.Id})
       .ToList();

見る:

@Html.DropDownListFor(model => model.VehicleMake, Model.VehicleMakeList)
9
JOBG

ドロップダウンリストのバインドはMVCでは非常にトリッキーです。コントローラーでこれを行うと、すべての都市のリストを取得して、viewBagに配置できます。

作成する

      ViewBag.CityId = new SelectList(db.Cities, "ID", "Name");

編集中の場合はuser.CityID。編集時に都市を選択します。

      ViewBag.CityId = new SelectList(db.Cities, "ID", "Name", user.CityID);

ビューでこのトリックを実行してください

     @Html.DropDownList("CityId", "Select")

これは私が知っている最も簡単な方法です。

3
dnxit

ドロップダウンリストのバインドは簡単です。次のようにコード

public ActionResult BindWithModel()
{
    List<SelectListItem> items = new List<SelectListItem>();

    items.Add(new SelectListItem 
                { Text = "Select Category", Value = "0", 
                        Selected = true });
    items.Add(new SelectListItem
                { Text = "Beverages", Value = "1" });
    items.Add(new SelectListItem
                { Text = "Condiments", Value = "2" });
    items.Add(new SelectListItem
                { Text = "Confections", Value = "3" });
    items.Add(new SelectListItem
                { Text = "Dairy Products", Value = "4" });
    items.Add(new SelectListItem
                { Text = "Grains/Cereals", Value = "5" });
    items.Add(new SelectListItem
                { Text = "Meat/Poultry", Value = "6" });
    items.Add(new SelectListItem
                { Text = "Produce", Value = "7" });
    items.Add(new SelectListItem
                { Text = "Seafood", Value = "8" });

    var model = new CategoryModel()
    {
        lstCategory = items,
        selected = 1
    };

    return View(model);
}

表示中のコード

@model BindMvcDropdownList.Models.CategoryModel

<h1>Bind MVC DropDownList with Model</h1>

@Html.DropDownListFor(x => x.selected, Model.lstCategory)

ここから取得したコード http://dotnetmentors.com/mvc/how-to-bind-dropdownlist-in-asp-net-mvc-application.aspx

0
Mou