在此处输入图片说明我一直试图让它工作一段时间但不能。我需要一个Select2多选下拉列表(无搜索字段)。当用户在该下拉列表中单击时,这应显示MVC5 Controller操作的值列表。但我不能让这个工作。这是我的View,Controller和JavaScript文件。任何帮助,将不胜感激 编辑:此外,我试图从控制器传递回Javacsript的数据创建选择列表
编辑:请参阅附件中的图片
- 查看
@Html.HiddenFor(m => m.Id, new { id = "hidden-select2-setup", placeholder = "Please select an Owner", value = "000", style = "width:100%;" })
<input type="text" class="hidden" id="make" name="Makes" value="@Model.Owners" />
- 控制器
[HttpPost]
public JsonResult GetAllAutos(int id= 0)
{
var result = Automobile.GetAll();
var makes = result.Owners.Select( o => new {
text = o.Name,
id = o.Id
}).ToList();
return Json(makes);
}
- POCO
public class Automobile
{
public int Id { get; set; }
public string Make { get; set; }
public string Model { get; set; }
public List<Owner> Owners { get; set; }
public int? OwnerId { get; set; }
public static Automobile GetAll()
{
var auto = new Automobile();
var ownerList = new List<Owner>
{
new Owner{Id = 1,Name="Carlos Joseph"},
new Owner{Id = 2,Name="Bradley Cooper"},
new Owner{Id = 3,Name="Brad Pitt"},
new Owner{Id = 4,Name="Johnny Depp"}
};
auto.Owners = ownerList;
return auto;
}
}
public class Owner
{
public int? Id { get; set; }
public string Name { get; set; }
}
- Javacsript文件:
$("#hidden-select2-setup").select2({
placeholder: "Type to find a Contract",
allowClear: true,
allowMultiple: true,
ajax: {
cache: false,
dataType: "json",
type: "POST",
url: "/Automobile/GetAllAutos/1",
results: function (data) {
return { results: data };
}
},
formatResult: contractFormatResult,
formatSelection: contractFormatSelection,
escapeMarkup: function (m) { return m; }
});
function contractFormatResult(contract) {
$('#hidden-select2-setup')
.append($('<option></option>')
.attr('value', contract.id)
.text(contract.text))
return $('#hidden-select2-setup');
}
function contractFormatSelection(contract) {
return contract.name;
}
答案 0 :(得分:0)
有几种方法可以禁用搜索框:
1:
$('#selectId').select2({
minimumResultsForSearch: -1
});
2:
$('.select2-search, .select2-focusser').remove();
3:
.no-search .select2-search {
display:none
}
$('#selectId').select2({
dropdownCssClass : 'no-search'
});