jquery-select2

I have the following code (javascript): $('#cbxConnections').select2({ minimumInputLength: 0, multiple: false, allowClear: true, placeholder:{ text:"@Diccionario.Connections", id:" @Diccionario.Connections" }, ajax:{ url:'@Url.Action("GetActiveConnections","Admin")', dataType: 'json', type:'post', data:function(params){ return { q: params.term }; }, processResults: function(data,page){ return { results: data }; } }, escapeMarkup: function (markup) { return markup; }, templateResult: function(response){ return '<div>'+response.Name+'</div>'; }, templateSelection: function(response){ return

I have a Select2 element on a page that loads results via ajax. Would like to test this with capybara/rspec (using the poltergeist driver), but since the Select2 element actually starts out as a hidden field, and then populates a <ul> once results are processed, none of the normal select , fill_in or choose helpers will work. What I have now is something like it "should have a search field for events" do click_link "Select an Event" # this works as expected within('.select2-container') do # works find('.select2-search input').set(event.description[0,5]) # won't work! find(:xpath, "li[text()='#

I am using select2 plugin(ivaynberg.github.io/select2). I am trying to display a dropdown(select). It is getting all the items in data.php as options. However select2 is meant to be autocomplete plugin and should search for the search term a client input, and display the matching results only. At the moment it is displaying all the items and not getting the search results. Sorry for my language data.php is echoing out this: [{ "id": "1", "text": "item1", "exercise": "blah text" }, { "id": "2", "text": "item2" } ] The code is: $(document).ready(function () { $('#thisid').select2({

I'm using Select2 (version 3.4.0) to populate a tag list. The tags are matched against existing ones via ajax call, and I'm using createSearchChoice to allow creating new tags. The code works so far, and looks something like this: $(mytags).select2({ multiple: true, placeholder: "Please enter tags", tokenSeparators: [ "," ], ajax: { multiple: true, url: myurl, dataType: "json", data: function(term, page) { return { q: term }; }, results: function(data, page) { return data; } }, createSearchChoice: function(term) { return { id: term, text: term + ' (new)' }; }, }); All pretty standard, except

I have select2 controls set up with Ajax (have both single and multiple). I'm trying to have some values on page load but I'm not able to get this to work however. My code for select2 is given below: function AjaxCombo(element, url, multival ){ // multival = true or false multival = multival || false; $(element).select2({ minimumInputLength: 2, multiple: multival, separator: '|', ajax: { url: url, dataType: 'json', data: function (term, page) { var targetname = $(this).attr('name'); var target = targetname.slice(targetname.indexOf("[")+1, targetname.indexOf("]")); return { targettype: "search"

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 first line seems to have any effect, and it does focus the select2 field, however it requires an additional keypress to display the search field, and to allow typing in search string. Therefore, if you load the page and start typing: "Search", the "S" will open the search box and then the remainder of the keys will be entered into it, so you'll be searching "earch" According to the Select2 documentation

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 $apply'ing the model change or not using the third parameter for equality comparison (at least from my code). What do I need to do to get it to fire? Here is a plunk demonstrating the issue. shaunhusain I fixed some stuff. http://plnkr.co/edit/5Zaln7QT2gETVcGiMdoW?p=preview The JS var myMod = angular.module("myApp",[]).controller("MainController", function($scope){ $scope.myModel = {selectedId:null}; }

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 expression sotres the id only) I have tried $(".select2-chosen").text() , but this breaks when I have multiple select2 controls on the page. As of Select2 4.x, it always returns an array, even for non-multi select lists. var data = $('your-original-element').select2('data') alert(data[0].text); alert(data[0].id); For Select2 3.x and lower Single select: var data = $('your-original-element').select2('data')