Questions tagged [jquery-select2]
Select2 is a jQuery-based replacement for select boxes. It supports searching, remote data sets, and infinite scrolling of results.
5,580
questions
418
votes
36
answers
389k
views
Select2 doesn't work when embedded in a bootstrap modal
When I use a select2 (input) in bootstrap modal, I can't type anything into it. It's like disabled? Outside the modal select2 works fine.
Working example: http://jsfiddle.net/byJy8/1/
code:
<!-- ...
273
votes
45
answers
515k
views
Reset select2 value and show placeholder
How do I set the placeholder on value reset by select2. In my example If locations or grade select boxes are clicked and my select2 has a value than the value of select2 should reset and show the ...
253
votes
21
answers
272k
views
select2 - hiding the search box
For my more significant selects, the search box in Select2 is wonderful. However, in one instance, I have a simple selection of 4 hard-coded choices. In this case, the search box is superfluous and ...
174
votes
15
answers
219k
views
set the width of select2 input (through Angular-ui directive)
I have problem making this plunkr (select2 + angulat-ui) work.
http://plnkr.co/edit/NkdWUO?p=preview
In local setup, I get the select2 work, but I cannot set the width as described in the docs. It ...
157
votes
35
answers
682k
views
How to set selected value of jQuery Select2?
This belong to codes prior to Select2 version 4
I have a simple code of select2 that get data from AJAX.
$("#programid").select2({
placeholder: "Select a Program",
allowClear: ...
157
votes
11
answers
58k
views
What are the differences between Chosen and Select2?
Chosen and Select2 are the two more popular libraries for extending selectboxes.
Both seem to be actively maintained, Chosen is older and supports both jQuery and Prototype.
Select2 is jQuery only, ...
137
votes
9
answers
110k
views
Select2 dropdown but allow new values by user?
I want to have a dropdown with a set of values but also allow the user to "select" a new value not listed there.
I see that select2 supports this if you are using it in tags mode, but is there a way ...
123
votes
12
answers
118k
views
"query function not defined for Select2 undefined error"
Trying to use Select2 and getting this error on multiple item input/text field:
"query function not defined for Select2 undefined error"
114
votes
3
answers
81k
views
Is there a properly tested alternative to Select2 or Chosen? [closed]
I am looking for an alternative to Select2 that basically provides the same functionality, but includes proper tests.
The quest for the holy grail? The last unicorn?
112
votes
15
answers
161k
views
How can I set the initial value of Select2 when using AJAX?
I have a select2 v4.0.0 being populated from an Ajax array. If I set the val of the select2 I can see via javascript debugging that it has selected the correct item (#3 in my case), however this is ...
110
votes
12
answers
336k
views
jQuery select2 get value of select tag?
Hello friends this is my code:
<select id='first'>
<option value='1'> First </option>
<option value='2'> Second </option>
<option value='3'> Three </...
106
votes
8
answers
265k
views
How to use Select2 with JSON via Ajax request?
My Select2 3.4.5 is not working with JSON data.
Here is my input box on HTML:
<input class='form-control col-lg-5 itemSearch' type='text' placeholder='select item' />
…and my JavaScript
$("....
101
votes
37
answers
222k
views
How do I change select2 box height
I love the select2 box from https://github.com/ivaynberg/select2
I am using the format: option to format each element, and it looks great.
Everything is fine except the selected element is bigger ...
89
votes
11
answers
220k
views
How to get Selected Text from select2 when using <input>
I am using the select2 control, loading data via ajax. This requires the use of the <input type=hidden..> tag.
Now, I want to retrieve the selected text. (The value property in the data-bind ...
85
votes
7
answers
196k
views
Trigger an action after selection select2
I am using select2 library for my search.
is there any way to trigger an action after selecting a search result? e.g. open a popup, or a simple js alert.
$("#e6").select2({
placeholder: "Enter ...
81
votes
17
answers
214k
views
Select2() is not a function
I have downloaded select2 and "installed it" by putting it into my folder.
I then loaded it on my site and when I check the console I can see the file select2.js (where I see all of the ...
79
votes
4
answers
49k
views
Tagging with AJAX in select2
I am doing tagging with select2
I have these requirements with select2:
I need to search some tags using select2 ajax
Also I need to use "tags" in select2 which Allows values that are not in the ...
75
votes
14
answers
248k
views
JQuery select2 set default value from an option in list?
I want to be able to set the default/selected value of a select element using the JQuery Select2 plugin.
74
votes
14
answers
76k
views
select2 force focus on page load
I am trying to make a select2 box appear in its focused state on page load. I have tried the following:
$('#id').select2('focus');
$('#id').trigger('click');
$('#id').trigger('focus');
Only the ...
73
votes
7
answers
53k
views
Select2 Ajax Method Not Selecting
Ok, I'm sure there's something simple set wrong here but I'm not 100% what it is.
So I am trying to use Select2 AJAX method as a way of users to search a database and select a result. The call ...
72
votes
8
answers
166k
views
select2 changing items dynamically
I have two selects that are linked: Each value of the first select determines which items will be displayed in the second select.
The values of the second select are stored in a two-dimension array:
...
71
votes
9
answers
182k
views
Get Selected value from Multi-Value Select Boxes by jquery-select2?
I am using Select2 Jquery to bind my dropdown which is used for multiple selection . I am using select2 jquery.
It's working fine, I can bind my dropdown but I need to get the ...
70
votes
19
answers
145k
views
Resetting Select2 value in dropdown with reset button
What would be the best way to reset the selected item to default? I'm using Select2 library and when using a normal button type="reset", the value in the dropdown doesn't reset.
So when I press my ...
70
votes
16
answers
303k
views
How to Set Selected value in Multi-Value Select in Jquery-Select2.?
I am binding my dropdown with Jquery-Select2. It's working fine but now I need to bind my Multi-Value selectBox by using Jquery-Select2.
My DropDown
<div class="divright&...
68
votes
14
answers
164k
views
How to use placeholder as default value in select2 framework
To get the chosen value of a select2 I'm using:
var x = $("#select").select2('data');
var select_choice = x.text
The problem is this throws an error if not value has been selected and I was ...
63
votes
10
answers
118k
views
select2 - Setting different width to input and dropdown
I am using Select2 3.3.2
I have very very long options in the select.
Example:
<select id="e1">
<option value="AL">Alabama</option>
<option value="WY">Wyoming</option>
&...
63
votes
20
answers
151k
views
JQuery Select2 - How to select all options
I'm using jQuery select2 multi select dropdown. I need to select all options in a dropdown from code.
Basically there is a Select All checkbox on which this functionality has to be implemented, I want ...
62
votes
9
answers
226k
views
Dynamically add item to jQuery Select2 control that uses AJAX
I have a jQuery Select2 control that uses AJAX to populate:
<input type="text" name="select2" id="select2" style='width:400px' value="999">
var initialSelection = { id: '999', text:"Some ...
59
votes
5
answers
90k
views
$watch not firing on data change
I have a watch setup against the model of a ui-select2 dropdown (from ui-bootstrap). The watch fires on load but not on data changes and I can't figure out why.
It isn't the usual problem of not $...
58
votes
4
answers
108k
views
How to remove select2 from dom
Say we have a simple select2 list:
<select id="e1">
<option value="AL">Alabama</option>
...
<option value="WY">Wyoming</option>
</select>
Initiated like:
...
57
votes
17
answers
153k
views
Clear dropdown using jQuery Select2
I'm trying to programmatically clear a drop down using the fantastic Select2 library. The drop down is dynamically filled with a remote ajax call using the Select2 query option.
HTML:
<input id="...
57
votes
11
answers
105k
views
How to clean completely select2 control?
I'm working with the awesome select2 control.
I'm trying to clean and disable the select2 with the content too so I do this:
$("#select2id").empty();
$("#select2id").select2("disable");
Ok, it ...
57
votes
8
answers
71k
views
Select2 performance for large set of items
I'm using select2 jquery plugin with twitter bootstrap. It's working fine for smaller number of items. But when the list is huge (more than 1500 items) it really slows down. It's slowest in IE.
...
52
votes
14
answers
45k
views
Cloned Select2 is not responding
I am trying to clone a row which contains select2 tool ,when i clone that row using jQuery the cloned select2 is not responding.In image given below first select2 which is original is working fine but ...
52
votes
4
answers
58k
views
Is there any way to check if an element has jquery select2 already applied to it?
I want to apply select2 to a bunch of jquery elements on the page that all have the same class name but it looks like if i call select2() on an element that already has had a select2() called on it ...
51
votes
8
answers
94k
views
How to render html in select2 options
In this example of data loaded from a remote source I can see images and other html elements rendered as options. I'd like to accomplish the same thing using data in a local array. I've tried ...
51
votes
10
answers
174k
views
Update select2 data without rebuilding the control
I am converting an <input type="hidden"> to a select2 dropdown and feeding it data through the query method
$('#inputhidden').select2({
query: function( query ) {
query.callback( ...
50
votes
4
answers
53k
views
Using Select2 get error - "Error: No select2/compat/query"
I am attempting to use the Select2 library in my site to leverage placecomplete (following it's rather simple configuration steps here), but when I run the code I get a strange error -
Error: No ...
50
votes
7
answers
85k
views
Select2 limit number of tags
Is there a way to limit the number of tags a user can add to an input field using Select2?
I have:
$('#tags').select2({
containerCssClass: 'supplierTags',
placeholder: "Usual suppliers...",
...
49
votes
15
answers
100k
views
How to make select2 work with jquery.validation plugin?
I'm trying to validate select2 field using jquey.validation plugin but nothing happens.
I want to make select required field.
I'm using this custom validation function:
$.validator.addMethod("...
49
votes
14
answers
54k
views
Select2 not calculating `resolved` width correctly if select is hidden
I am using Twitter bootstrap and the fantastic Select2 plugin.
These are working great, I realized you need to set {width: 'resolve'} when initiating Select2 otherwise it looks messed up!.
But I am ...
48
votes
17
answers
147k
views
Select2 open dropdown on focus
I have a form with multiple text inputs and some select2 elements.
Using the keyboard to tab between fields works fine - the Select2 element behaves like a form element and receives focus when ...
47
votes
9
answers
72k
views
Select2 deselect all values
I want to deselect all values with one click without using each id seperately.
I fiddled around for a while, but this deselect only first value. Any suggestions?
This is how I try to deselect:
$( "#...
47
votes
13
answers
70k
views
Select2: Hide certain options dynamically
Basically what I'm looking for is the ability to hide options from the dropdown of select items. So, technically they would still be options, but you just wouldn't be able to click them since they're ...
44
votes
2
answers
97k
views
select2 allowClear not enabled when options set dynamically
When I create select2 dropdowns that are dynamically driven by the selection in another select2 dropdown, the allowClear button for the updated dropdown becomes disabled.
It doesn't seem to matter if ...
43
votes
9
answers
130k
views
How to remove selected option from the option list in select2 multiselect and show selected options in the order they are selected
I have select2 multi select field in my form where I want to remove the selected option from the dropdown list after it is selected and again add it to the list if it is removed from the list. And ...
42
votes
14
answers
36k
views
Set focus to search text field when we click on select 2 drop down
I am using select2.js Version: 3.4.3 with bootstrap
I have one dropdown.
When I click on dropdown, I get a list with search text fields.
But I my cursor is not focused on search text fields.
<...
42
votes
13
answers
122k
views
Select2 doesn't show selected value
Select2 loads all items from my list successful, the issue I found when try to select a specific value when page loads. Example:
:: put select2 in a specific html element, no value is selected even ...
42
votes
7
answers
53k
views
Hide/Show Select2
I want to hide or show my select2, but I can't find a method in the API. I'm using a workaround, hiding the parent, like this:
$(document).on('change', '.country', function () {
if ($(this).val() ...
41
votes
8
answers
130k
views
Add class to select2 element
The documentation is either terrible or I'm missing something. I'm trying to add an error class to a select2 box for form validation. It's just a 1px red border.
I found the containerCssClass method ...