jquery – mvc4 razor中带有复选框的多选下拉列表

我正在开发MVC4项目,我有一个多选下拉列表

@Html.DropDownList("year_selected",(SelectList)(ViewData["YearSelected"]),new { tabindex = "14",multiple = "multiple",style = "width:150px;height:200px;" })

它填充了我在控制器中提到的年份列表

int minYear =Int32.Parse(Helper.MinYear);
int maxYear = Int32.Parse(Helper.MaxYear);
var yearSelectedList = new List<SelectListItem>();
for (int count = minYear; count <= maxYear; count++)
{
    yearSelectedList.Add(new SelectListItem()
    {
        Text = count.ToString(),Value = count.ToString()
        });
    }
    var yearselectlist = new SelectList(yearSelectedList,"Value","Text");
    ViewData["YearSelected"] = yearselectlist;

在下拉列表中单击我调用jquery来选择该特定值,并且当加载页面时,我通过默认选择它来检查保存在数据库中的值

这是jquery代码,用于选择保存在数据库中的值

if (str_year_selected.val() != "") {
    var yeararray = str_year_selected.val().split(",");
    for (var i in yeararray) {
         var val = yeararray[i];
         year_selected.find('option:[value=' + val + ']').attr('selected',1);
    }
}

这是我用来在用户点击时选择值或在下拉值上按下ctrl键的代码

year_selected.change(function () {
     var selectedyears = "";
     $("#year_selected :selected").each(function (i) {
        if (i != 0) {
            selectedyears += ",";
        }
         selectedyears += $(this).text();
     });
     str_year_selected.val(selectedyears);
});

一切都很完美.但现在问题是用户想要在下拉列表中的复选框,以便可以检查选项.

我该怎么做呢 ？

解决方法

user wants checkBox inside of dropdown so that can check the option.

有一个很棒的JQuery插件叫做Dropdown Check List,可以将常规的选择HTML元素转换为下拉复选框列表.

Download