jquery-select2 相关问题

Select2是基于jQuery的选择框的替代品。它支持搜索，远程数据集和无限滚动结果。

我使用 select2 库，并尝试在选项中添加徽章颜色。但这个徽章并没有显示出来。 < 我使用 select2 库，并尝试在选项中添加徽章颜色。但这个徽章不显示。 <select id="select2B" class="form-select" style="width: 60%;"> <option label="Choose one"></option> <?php foreach ($groupedStatuses as $group_name => $statusesGroup): ?> <optgroup label="<?= $group_name; ?>"> <?php foreach ($statusesGroup as $status): ?> <?php $selected = ($status['status_id'] == $order->status) ? 'selected' : ''; ?> <option value="<?= $status['status_id']; ?>" <?= $selected; ?>> <span class="badge" style="background-color: <?= $status['status_color']; ?>"> <?= $status['status_name']; ?> </span> </option> <?php endforeach; ?> </optgroup> <?php endforeach; ?> </select> <script> // With search $('#select2B').select2({ placeholder: 'Choose one' }); $('#select2B').one('select2:open', function(e) { $('input.select2-search__field').prop('placeholder', 'Search...'); }); </script> 谁能帮我如何直接在选项选择中显示这个颜色徽章？以下是如何使用 Bootstrap5 实现它。如果有帮助的话，我还在开头添加了图像图标。 <select class="select2-client-search form-control"> <option value="p-1" selected>Cafe Coffee Day #1050</option> <option value="p-2" disabled>Ratnadeep #1051</option> <option value="p-3">Bagels House #1052</option> <option value="p-4">Coffee 420 #1053</option> <option value="p-5">Momos India #1054</option> </select> <script> /* Let this helper function handle the UI modification */ function selectClient(client) { if (!client.id) { return client.text; } var $client = (jQuery)( '<span><img src="../assets/images/logos/select2/' + client.element.value.toLowerCase() + '.jpg" alt="img"> ' + client.text + ' <span class="badge bg-danger-gradient">CANCELLED</span></span>' ); return $client; } /* Call this in Document.ready */ (jQuery)(".select2-client-search").select2({ width: '100%', templateResult: selectClient, templateSelection: selectClient, placeholder: "Choose Client", escapeMarkup: function (m) { return m; }, }); </script>

bootstrap-5 jquery-select2

回答 0 投票 0

如何解决 Bootstrap 5 上的 Select2 深色主题问题

选择2问题当 bootstrap 5 select2 输入切换到深色模式时，我在 select2 上遇到问题我使用 Mazer 模板我想要当切换到黑暗模式时选择2...

jquery-select2 darkmode

回答 1 投票 0

Select2 在清除选择时抛出太多事件

我正在使用 Select2 进行多选。该选择用于过滤列表。选择一项将使用该过滤器重建列表。删除一项，再次重建列表而不指定...

javascript jquery jquery-select2

回答 1 投票 0

如何在不关闭select2的情况下刷新结果列表？

当未找到结果时，会出现“未找到结果”文本，并且现有数据被隐藏。当我用退格键删除它时，旧数据会在组合框关闭之前返回。当我

jquery jquery-select2

回答 1 投票 0

如何使用 Select2 创建带有字符串的动态链选择

我正在创建一个 DnD 风格的计算器。类树的深度为 3 类。我如何才能强制选择 2 在各自的选择中仅显示级别 1、级别 2 和级别 3...

javascript jquery jquery-select2

回答 1 投票 0

使用 Selenium webdriver 处理 Select2

我一直在用头撞墙，试图使用 selenium webdriver 从支持 ajax 的 select2 选择列表中选择一个选项。我已经设法让它与 IE webdriver 一起工作，但不行

c# selenium selenium-webdriver jquery-select2

回答 9 投票 0

将 select2 与 jQuery 虚拟键盘一起使用？

我想知道是否有任何方法可以使用 jQuery 虚拟键盘在 Select2 选择栏中输入内容。因为当您单击远离 Select2 组件时，下拉菜单会自动关闭...

javascript jquery jquery-select2

回答 2 投票 0

动态创建的 Select2 选项不会保存到数据库（Wordpress + BuddyPress）

我正在使用 BP XProfile 自定义字段类型插件将“标签”字段（基于 select2 的多选）添加到 BuddyPress 用户个人资料页面。编辑个人资料页面加载后，我会动态添加新的

wordpress jquery-select2 buddypress

回答 1 投票 0

扩展EntityType以允许通过AJAX调用设置额外的选择

我尝试创建一个扩展核心“实体”类型的 Symfony 自定义类型。但我想将它与 Select2 版本 4.0.0 一起使用（ajax 现在与“select”html 元素一起使用，而不是与隐藏的“输入”一起使用，例如...

php symfony jquery-select2

回答 3 投票 0

select2 的 Woocommerce 变体与默认选择冲突

我注意到，一旦我将 select2 添加到 Woocommerce 的变体中，并且设置了默认变体（比如说产品的宽度和高度）。那么就不可能选择默认选项...

wordpress woocommerce jquery-select2

回答 1 投票 0

使用 Select2 下拉列表后 Bootstrap 5 无法工作

Select2 功能运行正常。但是，Bootstrap 有一个问题，使用 Select2 后，Bootstrap 不再工作。我正在使用 Bootstrap 5.3。图片显示...

css-selectors dropdown bootstrap-5 jquery-select2 option-type

回答 2 投票 0

JQuery Select2 下拉列表无法在 MVC 中设置文本

我正在使用 select2 jquery 插件。我无法将文本设置/分配给选择控件。我使用带有触发功能的 select2 来设置值。首先我采取的控制是

javascript jquery asp.net-core-mvc jquery-select2

回答 1 投票 0

无法在 select2 下拉列表中设置预选值

我在我的项目中选择了 2 个下拉列表以下是如何将其添加到视图中（Razor）等级... 我在我的项目中选择了 2 个下拉菜单这是如何将其添加到视图中（Razor） <div class="form-group"> <label class="required-label">Tier</label> <select class="form-control" asp-for="PricingTierId" required> <option value="">@L("SelectAPricingTier")</option> @if (Model.PricingTierId.HasValue) { <option selected value="@Model.PricingTierId">@Model.PricingTierName</option> } </select> </div> 然后在js我像这样初始化它 var _pricingTierDropdown = null; _pricingTierDropdown = _$form.find('#PricingTierId'); _pricingTierDropdown.select2Init({ abpServiceMethod: abp.services.app.pricingTier.getPricingTiersSelectList, showAll: true, allowClear: true }); 它从 BE 获取值，一切都很好。但在某些情况下我需要设置预选值我尝试这样做 if(abp.features.isEnabled('App.PricingTiersFeature')){ if (!_pricingTierDropdown.val()) { abp.services.app.pricingTier.getPricingTiersSelectList("", "").done(function (result) { let def = result.items.filter(x => x.name === 'Retail'); console.log(def); _pricingTierDropdown.val(def.id); _pricingTierDropdown.trigger('change.select2'); }); } } 在控制台中，我得到了这样的选择值，但它没有显示为预选我该如何解决这个问题？您可以尝试使用下面更新的代码来设置预选值吗： if (abp.features.isEnabled('App.PricingTiersFeature')) { if (!_pricingTierDropdown.val()) { abp.services.app.pricingTier.getPricingTiersSelectList("", "").done(function (result) { let def = result.items.filter(x => x.name === 'Retail'); console.log(def); // Check if def is not empty if (def.length > 0) { _pricingTierDropdown.val(def[0].id); // Set the value with the id of the first element _pricingTierDropdown.trigger('change.select2'); } }); } }

javascript asp.net asp.net-core jquery-select2

回答 1 投票 0

如何在htmx中将select2元素的选定值作为参数传递？

我想使用查询参数进行 GET 请求。但是，查询参数需要从 select2 元素中获取。如何将 select2 的选定值传递给 htmx？以下是简化的...

django jquery-select2 htmx

回答 1 投票 0

页脚在不同的 select2 下拉菜单下方添加多次

我正在使用 select 2 jquery 插件创建多个多选下拉菜单，在某些情况下，页脚会在下拉菜单下多次附加。例如，如果您打开 drodpow...

javascript html jquery drop-down-menu jquery-select2

回答 1 投票 0

如果再次单击，select2 日期自定义选项将不会打开

$(文档).ready(function() { ///日期选择器 $("#date-range-options").select2({ 占位符：“选择”，搜索的最小结果：-1，关闭选择：假，允许清除：假 ...