标签: select2

我使用webpack管理我的所有资产,当我使用此代码来要求select2(https://github.com/select2/select2)我得到了错误

$(...).select2不是函数.

require.ensure(['./vendors/select2'],function (require) {
    require('./site');
});

// site.js
(function ($) {
    $(document).ready(function () {
        $(".js-1example-basic-single").select2();
    });
})(jQuery);

我认为模块导出有问题.我尝试了许多搜索,但没有希望.

有人请告诉我该怎么做,花了我大约10个小时.

谢谢!

我在我的表单中有select2多选字段,我想在选中它后从下拉列表中删除所选选项,如果从列表中删除它,再次将其添加到列表中.此外,添加的项目应与选择的顺序相同.当前select2(4.0)不会删除所选项目,并且它按照它们在下拉列表中显示的顺序显示所选项目,而不是按选择顺序显示.

$(document).ready(function(){
    $('#dynamicAttributes').select2({
            allowClear: true,
            minimumResultsForSearch: -1,
            width: 600
     });
 });

JSFiddle:https://jsfiddle.net/rd62bhbm/

<select data-placeholder="Select or type" data-minlength="2" multiple = "multiple" name='arrAval' id='listAval' class="js-basic-multiple form-control" required>

所以这是问题所在:

正如文档所说我应该能够为这个组件设置语言:

$(".js-basic-multiple").select2({
        language: "language-wanted"
    });

无论我设定哪种语言,它都会返回"没有找到结果".为了清楚起见,如在https://select2.github.io/examples.html#matcher中,它为'language:"es"'返回"No se encontraron resultados"

我想隐藏或显示我的select2,但我在API中找不到方法.我正在使用一种解决方法,隐藏父级,如下所示:

$(document).on('change', '.country', function () {
    if ($(this).val() == $(this).data('current-countryCode')) {
        $('#states').parent().show();
    }
    else {
        $('#states').parent().hide();
    }
});

但我想知道是否有人可以提供帮助,或者是否在API中存在这样的方法.

我怎样才能得到未选择的选项的值在选择二用select2:unselect

$('#mySelect').on("select2:unselect", function(e){

    var unselected_value = $('#mySelect').val(); // using this shows 'null'
    // or using below expression also shows 'null'
    var unselected_value = $('#mySelect :selected').val();

    alert(unselected_value);
}).trigger('change');

在上面的代码警报显示'null'

我需要使用,select2:unselect因为'change'事件会感觉到:select并且:unselect两者兼而有之.

我需要能够使用select2向我的多选字段添加搜索框.

无论出于何种原因,当搜索框在单选字段中按预期显示时,多选字段上的相同select2()调用不会添加搜索框.

var data = []; // Programatically-generated options array with > 5 options
var placeholder = "select";
$(".mySelect").select2({
    data: data,
    placeholder: placeholder,
    allowClear: false,
    minimumResultsForSearch: 5});

select2不支持多选的搜索框吗？有没有人有一个良好的功能相似的替代品？

我正在使用Select2 jQuery插件.

https://select2.github.io/供参考

当我使用多个下拉选项时.所选项目的结果在框中显示为标签,但我只想显示所选项目的数量.

是否可以使用Select2 jQuery插件

HTML

<select multiple style="width:100%">
  <option value="1">Name1</option>
  <option value="2">Name2</option>
  <option value="3">Name3</option>
  <option value="4">Name4</option>
  <option value="5">Name5</option>
  <option value="6">Name6</option>
  <option value="7">Name7</option>
</select>

JS

$('select').select2();

我想要输出如下

而不是像输出的标签.

工作小提琴的例子

我有像这样的依赖字段

    <List>
     <select>
      <option></option>
      <option></option>
     </select>
     <select>
      <option></option>
      <option></option>
     </select>
     <input />
   </List>

如果我有5个<List/>组件.如何将Select2添加到每个组件.我在网上搜索.但找不到任何有效的解决方案.

react-select下面的代码.获取错误TypeError:event.target是未定义的.

var React = require('react');
var ReactDOM = require('react-dom');
var Select = require('react-select');

var Page = React.createClass({

    getInitialState: function () {
        return {
            firstValue: ''
        }
    },

    handleFirstLevelChange : function (event) {
        this.setState({
            firstValue: event.target.value
        });
    },
    render : function(){

        var options = [
            { value: '', label: 'Select an option' },
            { value: 'one', label: 'One' },
            { …

我使用jquery-select2-4搜索外部数据库,并向用户显示他可以选择的搜索结果.

我有一个在这个jsfiddle上运行的工作版本.

但是,例如,如果只返回1个搜索结果,我想跳过整个选择过程,只需将返回的搜索结果添加到所选选项列表中.根据select2文档,我可以添加一个像这样的新选项:

option = new Option("Sample text", "123", true, true);
select2_element.append(option);
select2_element.trigger('change');

这似乎在某种程度上起作用.但是有一些问题.

• 添加选项后,我无法清除搜索字段.
• 我不能添加任何其他的id和a text.
• 添加的选项显示给用户undefined.

我意识到这个问题包含3个方面,但所有3个方面可能都会回到这个问题:

如何以编程方式添加新的jquery-select2-4选项并重置搜索字段？

供您参考,这是我要问的代码的上下文:

var formatRepo, formatRepoSelection, selectRepos;

formatRepoSelection = function(element) {
  return element.name + ' ' + element.forks + ' ' + element.id;
};

formatRepo = function(element) {
  var markup;
  if (!element.loading) {
    return markup = element.name + ' ' + element.id;
  }
};

selectRepos = function() {
  var option, select2_element; …

我是,使用bootstrap x-editable https://vitalets.github.io/x-editable/index.html

这是我的HTML代码:

<a href="#" data-name="category" class="addon" data-value="{{$cat->id}}"
   data-pk="{{$cat->id}}" data-type="select2" data-title="Favor llenar los campos"></a>

javascript代码:

$('.addon').editable({
    placement: 'bottom',
    mode: 'inline',
    showbuttons: false,
    source: categories,
    select2: {
        width: 200
    },
    display: function (value) {
        var elem = $.grep(categories, function (o) {
            return o.id == value;
        });

        $(this).attr('data-value', value);
        $(this).parent().parent().find('.btnEdit').attr('href', '/wizard_product/' + product_id + '/category/' + value + '/edit');

        return $(this).text(elem[0].text);
    }
});

但.我想在没有select2选项的情况下以编程方式更改为普通的x-editable元素.

我已尝试使用jquery将a元素的data-type属性更改为text,但它不起作用.

$('a.addon').attr('data-type', 'text');

还尝试过:

$('a.addon').select2('destroy');

还尝试过:

$('a.addon').editable({type: 'text'});

但两种选择都不奏效.select2仍处于活动状态.如何删除x-editable的select2选项？你能帮我吗