ASP.NET MVC - 清爽DropDownLists到視圖模型沒有寫DOM代碼

Question

我有一個視圖模型爲我的應用程序是這樣的：

public class ItemViewModel { 
    public string Name { get; set; } 

    public string SelectedType { get; set; } 
    public IEnumerable<Type> Types { get; set; } 

    public string SelectedSubtype { get; set; } 
    public IEnumerable<Subtype> Subtypes { get; set; } 
} 

我創建了一個視圖，以公開這些屬性：

@Html.TextBoxFor(m => m.Name) 

@Html.DropDownListFor(m => m.SelectedType, 
    new SelectList(Model.Types, "ID", "Description"), 
    "Select a type") 

@Html.DropDownListFor(m => m.SelectedSubtype, 
    new SelectList(Model.Subtypes, "ID", "Description"), 
    "Select a subtype") 

那麼，當我想刷新我的子類型dropdownlist，我必須編寫大量的DOM代碼來生成新的選項。

$('#SelectedType').change(function() { 
    $.get('/json/GetSubtypesFromType', { 'type': $(this).val() }, function(result) { 

     var options = ''; 
     for (var count = 0; count < result.length; count++) { 
      options += "<option value='" + result[count].ID + "'>" + result[count].Description + "</option>"; 
     } 

     $('#SelectedSubtype').html(options); 
    }); 
}); 

是否有新的選項，以亞型枚舉綁定到我的ViewModel而不是寫這個代碼生成選項的方式。我需要在發佈表單時檢索新的枚舉，但我想將新值綁定到ViewModel集合中。

Answer 1

觀察：你是'使用AJAX獲取值，並希望新值添加到你的DropDownList助手。

建議1：創建自定義Ajax下拉列表助手。

閱讀這篇文章http://www.codeproject.com/Articles/421640/Creating-a-custom-AJAX-Helper

另一個很好的參考How to make the equivalent of @Ajax.DropDownList?

特別有價值的參考 http://www.mikeyd.com.au/2009/08/22/dynamically-populate-a-selectdrop-down-list-using-aspnet-mvc-jquery-and-json/

建議2：使用操作部分以創建下拉列表 伏法爲@Html.Action("{Action}", {Controller}", new { id = {param})

或jquery如$('#dropdowndiv').load('/{Controller}/{Action}')，action部分首先調用一個action方法，然後渲染一個局部視圖。這非常適合您想要動態創建選擇列表的情況