多选下拉菜单,带有javascript中的复选框

时间:2018-01-12 08:34:22

标签: c# asp.net asp.net-mvc

I am using below code for dropdown

    @if (ViewBag.EventContentTypeId == Convert.ToInt32(EventContentType.Events))
    {
        <div class="col-sm-3 form-group input" style="padding-left:0">
            <div class="input-group">
                @Html.DropDownList("EventCategoryDDL", @ViewBag.EventCategories as IEnumerable<SelectListItem>, "-- Select Category --", new { @class = "form-control" })
                <span class="input-group-addon">
                    <i class="fa fa-file-text" aria-hidden="true"></i>
                </span>
            </div>
        </div>
    }

I want to change these to multi-select dropdown with checkbox.

And this is my controller code and this is in selectlist and i am unable to modify to multiselectlist is their a way to change to multiselectlist of selectlist. 

 ViewBag.EventCategories = ViewBag.EventContentTypeName == EventContentTypeString.Events.Value ? _commonService.GetEventCategoriesModel().Where(category =>category.OptionText != "Camp Kaufmann")
                                           .Select(i => new SelectListItem()
                                           {
                                               Text = i.OptionText,
                                               Value = i.OptionValue.ToString()
                                           }) :
                                           _commonService.GetEventCategoriesModel()
                                           .Select(i => new SelectListItem()
                                           {
                                               Text = i.OptionText,
                                               Value = i.OptionValue.ToString()
                                           }); 

我应该如何在控制器端更改为multiselectlist,以及如何使用multiselct复选框绑定下拉列表。

1 个答案:

答案 0 :(得分:0)

如果您只想显示@ ViewBag.EventCategories中每个项目的复选框,那么

@if (ViewBag.EventContentTypeId == Convert.ToInt32(EventContentType.Events))
    {
        <div class="col-sm-3 form-group input" style="padding-left:0">
            <div class="input-group">

                var eventCat = @ViewBag.EventCategories;  
                foreach(var item in eventCat){
                    <input type="checkbox" class="event-category" />
                }

                <span class="input-group-addon">
                    <i class="fa fa-file-text" aria-hidden="true"></i>
                </span>
            </div>
        </div>
    }

您必须分配正确的值,ID和类。