試圖瞭解哪些因素在@ Html.DropDownListFor

Question

當前選擇我有這樣的自定義視圖模式：

namespace MyCustomNamespace.Models 
{ 
    public class CustomViewModel 
    { 
     public CustomViewModel() 
     { 
      FirstViewModel = new FirstModel(); 
      SecondViewModel = new SecondModel(); 
     } 

     public FirstModel FirstViewModel { get; set; } 
     public SecondModel SecondViewModel { get; set; } 
    } 
} 

namespace MyCustomNamespace.Models 
{ 
    public class FirstModel 
    { 
     public string id { get; set; } 
     public string text { get; set; } 

     public IEnumerable<SelectListItem> Items 
     { 
     (...) 
     } 

     (...) 
    } 
} 

SecondModel類似於FirstModel。

在我看來，我不使用剃刀：

@model MyCustomNamespace.Models.CustomViewModel 

(...) 

@Html.DropDownListFor(m => m.FirstViewModel.Id, Model.FirstViewModel.Items) 

(...) 

我填充模型中的下拉列表。

我想知道哪些是上面顯示的下拉列表中當前選定的元素，但我不知道如何....也許通過模型？但是如何？

更新： 這是我的真實模型類型，上面是一個關於我在做什麼的例子。 FirstModel將ComponentTypeModel在這種情況下：

using System.Collections.Generic; 
using System.ComponentModel.DataAnnotations; 
using System.Linq; 
using System.Web; 
using System.Web.Mvc; 
using System; 
using Resources; 

namespace MyCustomNamespace.Models 
{ 
    public class ComponentTypeModel 
    { 
     private readonly List<ComponentType> componentTypes; 

     public ComponentTypeModel() 
     { 
      using (ConfigContext dbContext = new ConfigContext()) 
      { 
       try 
       { 
        componentTypes = dbContext.ComponentTypes.ToList(); 
       } 
       catch (Exception ex) 
       { 
        //EventLogger.LogException(ex);      
       } 
      } 
     } 

     [Display(Name = "Component Type")] 
     public int SelectedCompTypeId { get; set; } 

     public IEnumerable<SelectListItem> CompTypeItems 
     { 
      get 
      { 
       var allCompTypes = componentTypes.Select(f => new SelectListItem 
       { 
        Value = f.ComponentTypeId.ToString(), 
        Text = f.Name 
       }); 

       return DefaultCompTypeItem.Concat(allCompTypes); 
      } 
     } 

     public IEnumerable<SelectListItem> DefaultCompTypeItem 
     { 
      get 
      { 
       return Enumerable.Repeat(new SelectListItem 
               { 
                Value = "-1", 
                Text = "Select a component type" 
               }, 
             count: 1); 
      } 

     } 
    } 
} 

Answer 1

在你的模型，你正在使用

public IEnumerable<SelectListItem> Items 
     { 
     (...) 
     } 

這很好，但這樣做，你需要手動設置所選項目。我建議你使用SelectList而不是SelectListItems列表。

所以，在你的視圖模型，您需要：

public SelectList Items {get; set;} 

在你的控制器，你填充該SelectList：

var myItems = GetMyCollectionOfItems(); //The list to display in the DropDownList 
model.FirstViewModel.Items = new SelectList(myItems, "NameOfValueField", "NameOfTextField", selectedValue); //The selected value is optional 

然後在您的視圖中，您使用：

@Html.DropDownListFor(m => m.FirstViewModel.Id, Model.FirstViewModel.Items, "--- Select Item---", new { @id = "firstModelID" }) 

檢查這是你使用的相同的代碼，但是這樣，SelectList誰知道選擇哪個項目a nd你不需要手動做任何事情。只需在SelectList構造函數中加載選擇項的id即可。

然後，如果你需要在客戶端這是選擇的項目，以利用它在Javascript中隱藏着什麼之類的東西就知道了，你可以做什麼其他人的答案：

$(document).ready(function() { 
    var mySelectedValue = $('#firstModelID').val(); 
    alert(mySelectedValue); 
}); 

如果你需要知道什麼時候該選擇值的變化：

所有C：

$(document).ready(function() { 
    $('#firstModelID').change(function() { 
     alert($('#firstModelID').val()); 
    }); 
}); 

您更新後您在模型中使用的代碼，可以使用此答案中的代碼進行大大簡化。

你應該做一個小的變化：使

[Display(Name = "Component Type")] 
     public int SelectedCompTypeId { get; set; } 

[Display(Name = "Component Type")] 
     public int? SelectedCompTypeId { get; set; } //Now this is nullable 

如果你這樣，你不需要添加默認項事...只需使用：

@Html.DropDownListFor(m => m.FirstViewModel.Id, Model.FirstViewModel.Items, "Select a component type", new { @id = "firstModelID" }) 

然後在你的控制器中，你可以看到它是空的，你做的相當於你收到「-1」時所做的。

現在，所有的數據庫訪問都應該遠離模型。該模型更乾淨是這樣的：

public class ComponentTypeModel 
    { 
     [Display(Name = "Component Type")] 
     public int? SelectedCompTypeId { get; set; } 
     public SelectLis CompTypeItems { get; set:} 

    } 

然後在你的控制器，你這樣做：

var model = new ComponentTypeModel(); 
model.CompTypeItems = new SelectList(dbContext.ComponentTypes.Select(x => x.Name, x.ComponentTypeId), "ComponentTypeId", "Name"); 

如果你想擁有默認選擇其中之一（如你通常在編輯視圖） ，你這樣做：

var model = new ComponentTypeModel(); 
model.CompTypeItems = new SelectList(dbContext.ComponentTypes.Select(x => x.Name, x.ComponentTypeId), "ComponentTypeId", "Name", myDefaultValue); //where the myDefaultValue is an int 

視圖中的剃刀代碼應該保持不變，因爲所有關於選擇的項目，項目的收集，字段的信息被映射保留在控制器和模型。

Answer 2

如果你想在提交表格（在客戶端）

@Html.DropDownListFor(m => m.FirstViewModel.Id, Model.FirstViewModel.Items, "--- Select Item---", new { @id = "firstModelID" }) 

前需要了解它，你可以通過檢查其值：$('#firstModelID').val();

Answer 3

在C＃中無法識別客戶端，您必須使用jQuery/JavaScript，例如：

$("#FirstViewModel_Id").val(); 

Answer 4

var Id = $("#FirstViewModel_Id").val(); 

alert(Id); 

Answer 5

所選值將在發佈到服務器的發佈模型（FirstViewModel）的Id屬性中。

您可以訪問

如果你想在客戶端上選擇的值可以使用：

$("#FirstViewModel_Id").val(); 

或

$("#FirstViewModel_Id option:selected").val(); 

如果第一個不工作。

Answer 6

除了這裏的答案，你也可以這樣做：

$("#FirstViewModel_Id option:selected").val();