标签: jquery-select2
Select2 -- 选择选项后访问 URL
我有一个简单的 SELECT2 设置，如下所示：
<select name="cat" id="cat" class="js-example-basic-single">
<option value="URL.com">Option 1</option>
<option value="URL2.com">Option 2</option>
</select>
我很好奇如何使这些选项可点击，以便在搜索过程中点击或找到后，它们会立即转到 value="" 中的 URL。
我的标题包含：
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$(".js-example-basic-single").select2();
});
</script>
我知道网上有文档，但它不涵盖我的具体要求。
推荐指数
解决办法
查看次数
Yii2：如何禁用或只读 Select2 小部件？
我使用基于select2.github.io 的小部件，我需要它是只读的，以便用户可以看到默认的选择选项，但它无法更改，我认为这个小部件没有此选项。
是否有适用于任何 Select2 小部件的通用解决方案？
$form->field($model, 'id_color')->widget(Select2::classname(), [
'items' => ['1' => 'blue', '2' => 'red', '3' => 'yellow']
])
推荐指数
解决办法
查看次数
select2 多个选择作为 select2 搜索框中的计数
需要在多选搜索框中仅获取值和选择数量
请使用 select2 多选检查第一个屏幕截图，
我想要它像下面这样，因为如果我有多个选择框作为过滤器，上面的选择看起来不太好。
var elm = $('#error-type');
$(elm).select2({
placeholder: "Select features",
data: [
{ id: 0, text: "enhancement" },
{ id: 1, text: "bug" },
{ id: 2, text: "duplicate" },
{ id: 3, text: "invalid" },
{ id: 4, text: "wontfix" },
{ id: 5, text: "sdfsadf" },
{ id: 6, text: "ihfgdhfgdh" },
{ id: 7, text: "Vijaysinh" },
{ id: 8, text: "Parmar" },
{ id: 9, text: "invalid" },
{ id: 10, text: "Test …推荐指数
解决办法
查看次数
Select2 搜索输入在 bootstrap5 上不起作用
我无法单击搜索输入下拉列表。首先，我已经用谷歌搜索过，这是 select2 与 bootstrap3 或 bootstrap4 的常见问题，但是对于 bootstrap 5 来说有点不同（我尝试删除 bootstrap 4 上的 z-index 及其工作），我已经尝试过像 z 这样的解决方案-index $.fn.modal.Constructor.prototype.enforceFocus = function() {};、、、$('#mySelect2').select2({ dropdownParent: $('#myModal') });和一些 css 但仍然无法工作。
也许我错过了一些我不确定的东西，已经过去了 4 天，希望你们能帮助我。
这里 jsFiddle : jsfiddle
推荐指数
解决办法
查看次数
使用带有Rails 3.2.8的select2 gem时的Sprockets :: FileNotFound
我正在尝试测试一个示例Rails应用程序以使用select2 gem.我已经在select2-rails之后安装了gem .
但是,不幸的是我收到以下错误:
Sprockets::FileNotFound in Home#index
Showing /Users/Rakib/Desktop/Development/TEST_PROJECTS/selecttest/app/views/layouts/application.html.erb where line #5 raised:
couldn't find file 'select2'
(in /Users/Rakib/Desktop/Development/TEST_PROJECTS/selecttest/app/assets/stylesheets/application.css:14)
Extracted source (around line #5):
2: <html>
3: <head>
4: <title>Selecttest</title>
5: <%= stylesheet_link_tag "application", :media => "all" %>
6: <%= javascript_include_tag "application" %>
7: <%= csrf_meta_tags %>
8: </head>
Rails.root: /Users/Rakib/Desktop/Development/TEST_PROJECTS/selecttest
我的Gemfile是:
source 'https://rubygems.org'
gem 'rails', '3.2.8'
gem 'sqlite3'
group :assets do
gem 'sass-rails', '~> 3.2.3'
gem 'coffee-rails', '~> 3.2.1'
gem 'uglifier', '>= 1.0.3'
end
gem …推荐指数
解决办法
查看次数
jquery select2 .on("更改",函数(e)重置选项
我正在使用select2.
用法:如果值是"COUNTRY",我想向select2添加onchange事件,否则我想删除onchange事件,如下所示:
var reportLevel = getReportLevel();
if (reportLevel != "COUNTRY") {
$("#selected_countries").on("change", function(e) {
prepareGlidModel(e);
});
} else {
$("#selected_countries").on("change", function(e) {
});
}
问题:即使调用了else块,也无法删除onchange事件.根据reportLevela中选择的值调用事件dropdown.
推荐指数
解决办法
查看次数
显示列表而不绑定select2 ajax jQuery
我正在使用基于select2 ajax的jQuery来显示下拉列表.它的工作完美.现在我希望当用户点击select2框而不键入时,它将显示10条记录.我正在使用InitSelection,但它没有显示任何内容.代码是: -
var tags = [
{'id':1, 'text':'Ben'},
{'id':22, 'text':'Andrea'}
];
$('#form_fb_q').select2({
minimumInputLength: 2,
ajax: {
url: "/provisioning/api/facebook/default/",
cache: true,
dataType: 'json',
quietMillis: 250,
data: function (term, page) {
return {
q: term,
method: $('input[name=fb_search_by]:checked').attr('method')
};
},
results: function (data, page) {
return {
results: data.data
};
}
},
formatResult : function (entry) {
var markup = "<table class='entry-result'><tr>";
markup += '<td class="entry-image"><img src="http://graph.facebook.com/' + entry.id + '/picture?type=square"/></td>';
markup += "<td class='entry-info'><div class='entry-name'>" + entry.name + "</div>";
markup += …推荐指数
解决办法
查看次数
以编程方式将所选选项添加到Select2中
我有一个选择select2使用ajax搜索来查找结果.我已经像这样初始化它:
Task.ConfigureAssignee = function (objId) {
var sectionID = (Utilities.GetQueryStringParams('subsection') != undefined) ? Utilities.GetQueryStringParams('subsection') : "-1";
$(objId).select2({
placeholder: 'Type names of people...',
minimumInputLength: 3,
multiple: false,
width: '520px',
id: function (obj) {
return obj.ID;
},
ajax: {
type: "POST",
datatype: 'json',
url: "/webservices/globalwebservice.asmx/EventInviteSearch",
data: function (term) {
return JSON.stringify({ q: term, sectionId: sectionID });
},
contentType: 'application/json; charset=utf-8',
results: function (data, page) {
return { results: data.d.SearchResults };
}
},
formatResult: Task.FormatPersonSearchResult,
formatSelection: Task.PersonForSelection
})
}
我想做的是点击一下按钮,通过javascript将一个新项目添加到选择中.
我$("#ddlinput").select2("val", "CA"); …
推荐指数
解决办法
查看次数
初始化jquery datepicker上的select2下拉列表
我有一个应用程序,包含select2插件定制的所有下拉框,显然是这样的:
$("select").select2();
但是,jquery datepicker上的select元素不是自定义的.我无法弄清楚在jquery datepicker函数中初始化它的位置.以下是我想要实现的目标.我想要一个可以替换init的函数,它可以获取datepicker dom元素.
$(".datepickerInput").datepicker({
init : function(datepickerElement) {
datepickerElement.find("select").select2();
}
});
我感谢您的帮助.谢谢.
推荐指数
解决办法
查看次数
如何在javascript或jQuery中设置select2（3.5版）下拉列表的selectedindex
简单的问题，但没有答案。是否可以通过序号设置Select2下拉列表的selectedIndex？我使用的是Select2版本3.5.2，发现使用如下所示的值来选择项非常容易：
$(elem).select2('val','my value',false);
但是，尝试通过序数进行选择完全使我无所适从。正常下拉菜单有效的一些示例，但Select2无效：
$(elem + " option")[1].selected = true; //no worky
$(elem + " option:eq(1)").attr("selected", "selected"); //no worky
$(elem).prop({ selectedIndex: 1 });//no worky
我需要它的原因是要有一个默认选择而不是第一个选择，因为Select2使用第一个选项（索引：0）来填写提示，所以我想默认使用索引：1（它们可以有很多选择）不同的值，因此我不能只通过一个值设置所选选项-它必须是序数。
更新：问题可能出在这里（所有选择的值均为空以及所需的空选项）-可能会感到困惑。
<option selected="selected" value=""></option>
<option value="">All Sizes</option>
<option value="6ad0a51e-e58c-4431-914d-b3f1a6b2c08e">18in X 18in</option>
<option value="a00b492e-08fa-4824-ad86-9ffb8a510be2">9.75in X 39in</option>
<option value="423b2a4e-2876-4969-84e3-3601e3fab524">19.7in X 19.7in</option>
<option value="9d4f4f13-47f6-422c-bbaf-f0911b5c156c">12in x 36in</option>
<option value="d417f0bc-d1fe-4d6b-bf41-aa081907254c">22in X 22in</option>
<option value="d1dc3ca6-fc3c-47f8-8b71-80219c8fd98b">24in X 24in</option>
<option value="c92c91a3-dfdb-4240-83e2-c08771748e47">18in x 36in</option>
<option value="4741d76f-628f-4ca0-a871-dfe2c4986e66">19.7in X 39.4in</option>
<option value="f70791ba-c56a-403b-b23e-fb2e8869ba07">36in X 36in</option>
<option value="7f70b445-a890-4838-a9f5-4c3100643fdd">39in X 39in</option>
我将为第一个选项提供一个值（“所有尺寸”，“所有颜色”，“仅库存商品”，“仅限销售类别”等），并将其设置为与数据库中相同的值，例如“-”作为第一项（这样，我不需要进行比较）。设置selectedIndex（要更新的许多旧代码）仍然会很好-我会将其发布在他们对Select2的未来修订版的要求中
更新：这是该函数的外观
function setDD(elem, qs) {
var q …推荐指数
解决办法
查看次数
标签 统计
jquery-select2 ×10
jquery ×6
javascript ×3
bootstrap-5 ×1
html ×1
jquery-ui ×1
php ×1
sprockets ×1
yii2 ×1