Sas*_*ois 6 javascript ajax asp.net-mvc jquery jquery-select2
我目前正在我的 ASP.NET MVC 项目中测试 Select2.js。
\n\n对“普通”视图的第一个测试工作正常，但现在我尝试将其添加到部分视图内的选择框，该部分视图在 Ajax 调用上加载，然后显示在<div>普通视图页面上。
生成下拉列表的代码如下所示：
\n\n@Html.DropDownList("addRole",\n new SelectList(ViewBag.availableRoles, "Id", "Name"),\n "Rolle ausw\xc3\xa4hlen", \n new { @name="addRole", @class = "form-control" }\n)\n在部分视图文件的末尾我添加了以下内容：
\n\n$(document).ready(function () {\n //var data = [{ id: 1, text: "Test" }];\n\n $("#addRole").select2({\n //data: data\n });\n});\n看起来它可以工作，因为选择框的外观发生了变化，但当我尝试打开它时，它什么也没显示。当我取消注释data上面的变量代码时，也会发生同样的情况。
它只是没有向我显示任何内容，我也不知道为什么。
\n\n我已经尝试将 JavaScript 代码添加到AJAX 调用的函数$(document).ajaxComplete中或函数中success，但它不会改变任何内容。
我现在得到了答案。\n问题不是 select2 元素没有项目，问题是给定的项目没有显示。于是我就想为什么\xc2\xb4他们没有出现，发现我\xc2\xb4m真的很蠢。\n它确实出现了，但由于 z-index 我无法\xc2\xb4t 看到它。我的弹出窗口的 z 索引为 20k，因此下拉列表位于窗口后面。
\n\n所以要解决这个问题只需添加：
\n\n.select2-dropdown {\n z-index:99999;\n}\n或者使用给定的 z-index 将 dropdownCssClass 添加到 select2 设置，如下所示：
\n\n.select2-dropdown.increasezindex {\n z-index:99999;\n}\nJS：
\n\n$(document).ready(function () {\n $("#addRole").select2({\n dropdownCssClass:\'increasezindex\'\n });\n});\n就我而言，我在弹出元素上显示 select2，这会导致下拉列表消失，因为它默认附加到该<body>元素。
Select2故障排除指南强调了 Bootstrap 模式的类似问题。
为了解决这个问题，我必须使用提供的下拉放置选项，
let $select = $('select'),
$parent = $select.parent();
$select.select2({
dropdownParent: $parent
});
| 归档时间： |
|
| 查看次数： |
15789 次 |
| 最近记录： |