标签: jquery-select2-4

我试图让淘汰赛(版本3.1)与select2(版本4.0rc2)一起使用.

我无法让select接受输入并进行初始选择.选择似乎是只读的.

下面是一个表明我的问题的小提琴.我在Chrome上测试了这个(版本40.0.2214.115米).

http://jsfiddle.net/R8UF5/402/

JavaScript的:

ko.utils.setValue = function (property, newValue) { if (ko.isObservable(property)) property(newValue); else property = newValue; };

ko.bindingHandlers.select2 = {
init: function (element, valueAccessor, allBindingsAccessor) {
    var obj = valueAccessor(),
        allBindings = allBindingsAccessor(),
        lookupKey = allBindings.lookupKey;

    $(element).select2(obj);

    ko.utils.registerEventHandler(element, "select2-selected", function (data) {
        if ('selectedValue' in allBindingsAccessor()) {
            ko.utils.setValue(allBindingsAccessor().selectedValue, data.choice);
        }
    });

    ko.utils.domNodeDisposal.addDisposeCallback(element, function () {
        $(element).select2('destroy');
    });
},
update: function (element, valueAccessor, allBindingsAccessor) {
    var options = allBindingsAccessor().select2Options || {};

    for (var property in options) {
        $(element).select2(property, ko.utils.unwrapObservable(options[property])); …

我正在使用select2 4.0,当我从json文件加载数据时,没有任何创建的元素触发select2:select事件.我认为它与事件委托有关,但网站上的例子似乎做得很好.

在过去的一个小时里,我一直在忽视这一点,我只是不明白我错过了什么.

现在我用它来选择一个项目,但这显然不起作用:

$("body").on("click", "#select2-select-results .person-entry", function()
{
    var $this = $(this);
    var name = $this.data('name');

    select2.find('option').val(name).text(name);
});

绑定$(...).on('select2:select');永远不会发生,但$(...).on('select2:open);确实如此.所以我不确定发生了什么.

然而,我注意到的是,在加载数据时,没有<option>创建标签.

这是我处理这件事的整个JavaScript:

(function($)
{
    "use strict";
    var term = null;
    var select2 = $("#select");

    select2.select2({
        allowClear: true,
        ajax: {
            url: "js/data.json",
            dataType: "json",
            delay: 250,
            data: function(params)
            {
                // Save the terms for filtering
                term = params.term;

                return params;
            },
            processResults: function(data)
            {
                var people = [];

                for(var i = 0; i …

我已经搜索了许多答案并尝试了它们,但我无法使用jquery动态更改select2下拉列表的值.

我正在使用ajax select2使用json远程获取数据.

下拉工作正常.

这是我到目前为止所尝试的.

//UserGroupID is a variable contains the database value
var groupSelector = $("#EditSpeciality");
//1.
groupSelector.select2("val", {ID: userGroupID, TEXT: "Lorem Ipsum"});
//2.
groupSelector.val(userGroupID).trigger("change");
//3.
groupSelector.select2("val", {ID: userGroupID, TEXT: "Lorem Ipsum"});
//4.
groupSelector.val(userGroupID);

但它们似乎都没有改变下拉值.

如何动态设置值..

这是我的HTML.

<select class="form-control select2" id="groupSelector" name="groupSelector" style="width: 100%;"></select>

= - = - = - = - = - = - = - = - = - = - =

更新:

我使用codeigniter MVC,我知道这应该不重要.但是想把所有东西放在桌子上.

select2的版本是4.0.0

我得到的JSON代码来自Controller,select2正在填充列表.

以下是select2 Code.

function commonSelect2(selector,url,minInputLength,placeholder){
    selector.select2({
        minimumInputLength:minInputLength,
        placeholder:placeholder,
        ajax: { …

我使用的是select2插件的最新版本（4.0.2），我想从单选中删除箭头（如multiselect输入样式）。我试图编辑有箭头元素但没有成功的css。有人可以告诉我该怎么办吗？谢谢

如何增加select2建议下拉菜单的高度？

我尝试了https://github.com/select2/select2/issues/144提出的想法：

.select2-results {
  max-height: 500px;
}

但是，这不起作用。如果我改为设置该min-height属性，则尺寸会增加，但是，如果只有1或2个项目，我不希望有500px的巨大下拉列表...因此，min-height这不是一个真正的选择。

我希望下拉菜单动态调整其高度以适应内容，但是在显示滚动条之前将其高度增加到500px。

我正在尝试使用select2 jQuery插件来增强selectHTML应用程序中的元素。选择允许选择多个项目。

我想从下拉列表中删除当前选中的项目。我没有在文档中找到明确的解决方案。

我发现的当前解决方案是使用templateResultoption，null如果选择了该项目，则返回模板函数。设置了该原因Results.prototype.template功能，container.style.display = 'none'但是具有的副作用是，即使它们不可见，键盘仍会选择这些项目。

我正在尝试在Select2 v4下拉项中显示fontawesome图标。但是下拉菜单显示的是html，而不是生成实际的图标。此方法适用于select2 V3，但似乎不适用于v4。任何帮助表示赞赏。谢谢

的HTML

<div class="select2-wrapper">
    <select class="input icons_select2">
        <option value="fa-dribbble" data-icon="fa-dribbble">Dribbble</option>
        <option value="fa-dropbox" data-icon="fa-dropbox">Dropbox</option>
        <option value="fa-facebook" data-icon="fa-facebook">Facebook</option>
    </select>
</div>

JS

function iformat(icon) {
var originalOption = icon.element;
return '<i class="fa ' + $(originalOption).data('icon') + '"></i> ' + icon.text;
}
$('.icons_select2').select2({
width: "100%",
templateSelection: iformat,
templateResult: iformat
});

有关示例，请参见小提琴：http : //jsfiddle.net/qCn6p/206/

我正在将Select2JS 4.0.5与PHP和jQuery 3.2.1结合使用。首先包含jQuery，然后是select2js，然后是其余JS库。我的密码

if ($("#company").length > 0){   // The code below works with typeaheadJS
$('#company').select2()({
source: function (query, syncResults, asyncResults) {
        $.ajax({
            url: "common/search.php",
            data: 'query=' + query,
            dataType: "json",
            type: "POST",
            success: function (data) {
                asyncResults($.map(data, function (item) {
                    return item;
                }));
            }
        });
    }
});
} 

我不断 Error: No select2/compat/inputData

类似的问题说，如果我包含完整版本，则会修复此错误。如果我这样做，错误将变成

TypeError: $(...).select2(...) is not a function

我试图将内容从不同的html页面加载到弹出窗口，然后在其上应用select2。

一切正常，但是select2的z索引不正确，如果我将其修改为大于引导对话框的值，则发生这种情况。

这是我在做什么的摘要

.select2-dropdown {  
  z-index: 10060 !important;/*1051;*/
}

有任何想法吗 ？

我正在使用Select2作为搜索下拉列表,但是当我在列表中选择一个项目时,它会一直显示前一个值.

我初始化Select2下拉列表:

$(document).ready(function() {
  $(".ordersSelect").select2();
});

然后设置所有选项:

<select class="ordersSelect" style="width:75%;">
  <option value>Select a priority...</option>
  <option value="0">0</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
  <option value="6">6</option>
</select>

所以我要说我从这段代码中选择1,我的控制台:

// when value is selected
$('.ordersSelect').on('select2:selecting', function(e) {
  var prioritySelection = $('.ordersSelect').select2('data')[0].text;
  console.log("DATA: " + prioritySelection);
});

将显示"DATA:选择优先级......".如果我然后选择说'3',控制台将显示"DATA:1".

它不断显示上一个选择的值.当我将"select2:choose"更改为"select2:selected"时,控制台消息永远不会出现.

我在这做错了什么..？