多选下拉列表,带有mvc4剃刀中的复选框

Mah*_*344 9 jquery jquery-ui asp.net-mvc-4

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

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

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

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;
Run Code Online (Sandbox Code Playgroud)

在下拉列表中单击我调用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);
    }
}
Run Code Online (Sandbox Code Playgroud)

这是我用来在用户点击时选择值的代码,或者在下拉值上按下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);
});
Run Code Online (Sandbox Code Playgroud)

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

我该怎么做呢 ?

शेख*_*ेखर 8

您可以在div中使用带有css的复选框,而不是使用下拉列表.它会像带有复选框的下拉列表一样下降.

这是jquery的好链接

http://www.erichynds.com/blog/jquery-ui-multiselect-widget


Abb*_*iri 6

用户想要下拉列表中的复选框,以便检查选项.

有一个很棒的JQuery插件调用Dropdown Check List它将常规选择HTML元素转换为下拉复选框列表.

在此输入图像描述

下载


Ram*_*ree 6

此链接在下拉列表中有复选框,我希望此链接最适合您的问题. http://wenzhixin.net.cn/p/multiple-select/#setselects-getselects