选择宽度问题在非活动选项卡容器内

Question

我正在使用选择库来启用下拉控件上的轻松过滤,我现在面临一个问题.我正在使用引导选项卡控件来排列表单中的项目,如果我将Dropdown放在非活动选项卡项目中,选择下拉列表的宽度为0(完全不可见).

我怎样才能解决这个问题？

@Html.DropDownListFor(model => model.OriginalItem.AuthorId, (SelectList)ViewBag.LicensorList, "Select", new { @class = "chosen-single chosen-default" })
 $('#OriginalItem_AuthorId').chosen({ no_results_text: "Oops, nothing found!" });

这是我使用所选库的方式

Answer 1

这是因为在下拉可见之前,通过选择计算宽度.

至少有两种解决方法:

CSS解决方法:

.chosen-container { 
    width: 100% !important; /* desired width */
} 

JS解决方法 (在选择初始化时) :

$(".chosen-select").chosen(
    { 
        width: '100%' /* desired width */
    });