產生的JavaScript選擇列表的選項從控制器

Question

recevinig JSON數據後，我在控制器（MVC）的列表

public CompanyController() { 
     _company = new List<CompanyModel>{ 
      new CompanyModel{Name="A 1", Email="a1@company.com", Group="Group1"}, 
      new CompanyModel{Name="A 2", Email="a2@company.com", Group="Group2"}, 
      new CompanyModel{Name="A 3", Email="a3@company.com", Group="Group3"}, 
      new CompanyModel{Name="B 1", Email="b1@company.com", Group="Group1"}, 
      new CompanyModel{Name="C 1", Email="c1@company.com", Group="Group2"}, 
      new CompanyModel{Name="D 1", Email="d1@company.com", Group="Group4"}, 
      new CompanyModel{Name="E 1", Email="e1@company.com", Group="Group5"}, 
      new CompanyModel{Name="E 2", Email="e2@company.com", Group="Group6"}, 
      new CompanyModel{Name="F 1", Email="f1@company.com", Group="Group6"}, 
      new CompanyModel{Name="G 1", Email="b1@company.com", Group="Group5"}, 
      new CompanyModel{Name="H 1", Email="b1@company.com", Group="Group6"}, 
      new CompanyModel{Name="I 1", Email="b1@company.com", Group="Group3"}, 
      new CompanyModel{Name="J 1", Email="b1@company.com", Group="Group7"}, 
      new CompanyModel{Name="K 1", Email="b1@company.com", Group="Group6"}, 
      new CompanyModel{Name="L 1", Email="b1@company.com", Group="Group1"}, 
      new CompanyModel{Name="M 1", Email="b1@company.com", Group="Group2"}, 
      new CompanyModel{Name="N 1", Email="b1@company.com", Group="Group2"}, 
      new CompanyModel{Name="O 1", Email="b1@company.com", Group="Group4"}, 
      new CompanyModel{Name="P 1", Email="b1@company.com", Group="Group5"},    
      new CompanyModel{Name="R 1", Email="b1@company.com", Group="Group5"}, 
      new CompanyModel{Name="S 1", Email="b1@company.com", Group="Group8"}, 
      new CompanyModel{Name="T 1", Email="b1@company.com", Group="Group8"}, 
      new CompanyModel{Name="U 1", Email="b1@company.com", Group="Group1"}, 
      new CompanyModel{Name="V 1", Email="b1@company.com", Group="Group2"}, 
      new CompanyModel{Name="X 1", Email="b1@company.com", Group="Group4"}, 
      new CompanyModel{Name="Y 1", Email="b1@company.com", Group="Group3"}, 
      new CompanyModel{Name="Z 1", Email="b1@company.com", Group="Group3"}, 
      new CompanyModel{Name="W 1", Email="b1@company.com", Group="Group6"}, 
     }; 
     } 

我通過JSON發送到JQuery的是：

objectCompany = null; 
data = ""; 

$.ajax({ 
     url: '/Company/List', 
     dataType: 'json', 
     contentType: 'application/json; charset=utf-8', 
     success: function (msg) { 
      data = msg; 
     }, 
     complete: function() { 
      objectCompany = data; 
     } 
     }); 

我想附加到我的select標記<select name="filters" id="filters"></select>所有具有Group值但不重複相似值的選項。

UPDATE

if (objectCompany != null) { 
    $("#filters").empty(); 
    $("#filters").html("<option value='all' selected='selected'>All groups</option>"); 
    var arrayUnique = []; 
    for (var i = 0; i < objectCompany .length; i++) { 
     for (var j = i + 1; j < objectCompany .length; j++) { 
      if (objectCompany [i].Group === objectCompany [j].Group) { 
       j = ++i; 
      } 
     } 
     arrayUnique.push(objectCompany [i].Group); 
    } 

    arrayUnique = arrayUnique.sort(); 

    $.each(arrayUnique, function (k, v) { 
     $("#filters").append("<option value='" + v + "'>" + v + "</option>"); 
    }); 
     } 

更新：現在工程:)

Answer 1

爲什麼用JavaScript掙扎？你爲什麼不使用視圖模型？爲什麼不準備控制器操作中的數據，以便所有視圖必須顯示？用JSON中的一些重複組來浪費帶寬的目的是什麼？

public ActionResult List() 
{ 
    var model = _company.Select(x => x.Group).Distinct(); 
    return Json(model, JsonRequestBehavior.AllowGet); 
} 

現在很簡單：

var filters = $('#filters'); 
filters.empty(); 
filters.append(
    $('<option/>', { 
     value: 'all', 
     selected: 'selected', 
     text: 'All groups' 
    }) 
); 
$.each(objectCompany, function (index, group) { 
    filters.append(
     $('<option/>', { 
      value: group, 
      text: group 
     }) 
    ); 
}); 

---

UPDATE：

如果你想要做的客戶端上的這種過濾可以定義一個函數，它會得到不同的元素：

$.extend({ 
    distinct : function(arr, selector) { 
     var result = []; 
     $.each(arr, function(index, value) { 
      var item = selector(value); 
      if ($.inArray(item, result) == -1) { 
       result.push(item); 
      } 
     }); 
     return result; 
    } 
}); 

a那麼：

var filters = $('#filters'); 
filters.empty(); 
filters.append(
    $('<option/>', { 
     value: 'all', 
     selected: 'selected', 
     text: 'All groups' 
    }) 
); 
var groups = $.distinct(objectCompany, function(item) { return item.Group; }); 

$.each(groups, function (index, group) { 
    filters.append(
     $('<option/>', { 
      value: group, 
      text: group 
     }) 
    ); 
});