Questions tagged [jquery-select2]

Select2 is a jQuery-based replacement for select boxes. It supports searching, remote data sets, and infinite scrolling of results.

Filter by
Sorted by
Tagged with
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: <!-- ...
breq's user avatar
  • 24.6k
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 ...
fefe's user avatar
  • 8,815
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 ...
EleventyOne's user avatar
  • 7,390
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 ...
bsr's user avatar
  • 57.6k
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: ...
ClearBoth's user avatar
  • 2,265
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, ...
Boycott Russia's user avatar
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 ...
johnjohn's user avatar
  • 4,231
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"
Daniel Morris's user avatar
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?
Joseph Tura's user avatar
  • 6,290
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 ...
Greg's user avatar
  • 1,833
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 </...
Renish Khunt's user avatar
  • 5,670
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 $("....
melvnberd's user avatar
  • 3,093
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 ...
relipse's user avatar
  • 1,750
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 ...
robasta's user avatar
  • 4,631
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 ...
spyfx's user avatar
  • 1,321
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 ...
Marc Rasmussen's user avatar
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 ...
Sri's user avatar
  • 1,505
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.
user857276's user avatar
  • 1,407
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 ...
user984976's user avatar
  • 1,314
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 ...
AlbertEngelB's user avatar
  • 16.1k
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: ...
Pherrymason's user avatar
  • 7,875
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 ...
Kaps Hasija's user avatar
  • 2,117
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 ...
J2B's user avatar
  • 1,733
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&...
Kaps Hasija's user avatar
  • 2,117
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 ...
Gottfried's user avatar
  • 2,039
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> &...
naviram's user avatar
  • 1,445
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 ...
Ibad Baig's user avatar
  • 2,284
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 ...
Bumptious Q Bangwhistle's user avatar
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 $...
µBio's user avatar
  • 10.7k
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: ...
jdennison's user avatar
  • 2,030
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="...
wheaties's user avatar
  • 35.7k
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 ...
mllamazares's user avatar
  • 7,786
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. ...
Manish's user avatar
  • 1,266
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 ...
ABC's user avatar
  • 4,283
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 ...
leora's user avatar
  • 190k
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 ...
But those new buttons though..'s user avatar
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( ...
mfreitas's user avatar
  • 2,405
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 ...
Simon's user avatar
  • 2,085
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...", ...
imperium2335's user avatar
  • 23.6k
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("...
user2323711's user avatar
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 ...
Hailwood's user avatar
  • 90.1k
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 ...
andreivictor's user avatar
  • 7,763
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: $( "#...
Jaanus's user avatar
  • 16.3k
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 ...
jacheson's user avatar
  • 1,313
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 ...
Derek Henderson's user avatar
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 ...
user1614862's user avatar
  • 3,771
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. <...
user3386877's user avatar
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 ...
Ito's user avatar
  • 2,167
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() ...
Marquinho Peli's user avatar
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 ...
Deac Karns's user avatar
  • 1,191

1
2 3 4 5
112