预先填充<select multiple =“”>表单控件

Question

我正在尝试在＆lt; select multiple class = form-control＆gt;中预选多个值。元件。我正在使用ASP.Net Core和RAZOR来呈现html。 在html文件的顶部，我定义了我想要在多选框中显示的多个水果列表。稍后，我遍历列表并获得用户之前选择的成果，并尝试在列表中显示所选的选项。 @ {     var allFruitsList = new List＆lt; string＆gt;（）         { “草莓”， “蓝莓”， “香蕉”， “猕猴桃”，          “苹果”，“覆盆子”，“梨子”};     var profile = ViewData [“UserFavoriteFruit”];     var myFaveFruits = profile.MyFavoriteFruits; //将是List＆lt; string＆gt; } 这是代码部分，我将通过之前选择的结果来了解我希望在页面加载时选择哪些内容 ＆lt; select multiple class =“form-control”id =“myMultiselect”＆gt;     ＆lt;禁用选项＆gt; - - - - - 选择喜欢的水果 - - - - - ＆lt; / option＆gt;         @foreach（var v in allFruitsList）         {             if（myFaveFruits.Contains（@v））             {                 ＆lt;选项＆gt; @ v＆lt; / option＆gt;             }             其他             {                 ＆LT;选项＆GT; @ V氮化/选项＆GT;             }         } ＆LT; /选择＆GT; 我尝试了很多不同的东西，包括： ＆lt; option selected =“true”＆gt; @ v＆lt; / option＆gt; ＆lt; option selected =“selected”＆gt; @ v＆lt; / option＆gt; ＆lt;选项＆gt; @ v＆lt; / option＆gt; ＆lt; option selected =“selected”value = @ v＆gt; @ v＆lt; / option＆gt; ＆lt; option onload =“MakeSelectionLookSelected（）”＆gt;＆lt; / option＆gt; ＆lt; option onload =“MakeSelectionLookSelected（'@ v'）”id ='@ v'＆gt; @ v＆lt; / option＆gt; MakeSelectionLookSelected（）{     $（本）。点击（）; } MakeSelectionLookSelected（）{     $（本）.change（）; } MakeSelectionLookSelected（id）{     $（ “＃” + ID）。点击（）; } MakeSelectionLookSelected（id）{     $（ “＃” + ID）.change（）; } 这些方法都不起作用。奇怪的是，当我使用DOM资源管理器时，代码反映了正确的＆lt;选项＆gt;使用“selected”属性标记元素，但UI不显示应该选择的条目周围的蓝色框填充... 谁知道我做错了什么？我还能尝试什么？如果bootstrap multiple select不允许预填充？有什么好的选择呢？

Answer 1

找出解决方案！

所以我需要添加“selectpicker”类。 https://silviomoreto.github.io/bootstrap-select/

所以现在我的字段如下：

<select multiple class="selectpicker form-control" id="myMultiselect">

当单独使用selectpicker时，格式化会关闭，但同时使用它们也有助于将其样式化