jquery-select2-4 | 易学教程

How to set data-* from datasources in Select2?

阅读更多关于 How to set data-* from datasources in Select2?

I am using Select2 as follow: $('select#fields').select2({ placeholder: 'Select a field', data: data.fields }); data.fields is a JSON like this one: "fields": [ { "id": "companies_id", "text": "companies_id", "data-type": "int" }, { "id": "parent_companies_id", "text": "parent_companies_id", "data-type": "int" }, { "id": "client_of_companies_id", "text": "client_of_companies_id", "data-type": "int" }, { "id": "asset_locations_id", "text": "asset_locations_id", "data-type": "int" }, { "id": "companies_name", "text": "companies_name", "data-type": "varchar" }, { "id": "companies_number", "text":

How to clone select2 v4 Ajax

阅读更多关于 How to clone select2 v4 Ajax

I am attempting to do an AJAX call with the Select2 ver4 jquery plugin and Using Loading remote data of Select2 sample page I am trying to clone a select which contains select2 tool. But select2 dropdown disabled when cloning. HTML CODE <tr> <td> <select class="js-example-data-ajax" id="sel1"> </select> <button type="button" class="addline">Add Line</button> </td> </tr> jQuery CODE $.fn.select2.amd.require( ["select2/core", "select2/utils", "select2/compat/matcher"], function (Select2, Utils, oldMatcher) { var $ajax = $(".js-example-data-ajax"); function formatRepo (repo) { if (repo.loading)

Styling individual select2 tags

阅读更多关于 Styling individual select2 tags

I'm trying to style individual select2 tags using Bootstrap's button styles ( .btn-primary and .btn-danger ) based on if the user created a tag (applying the red .btn-danger style) or if the user selected a existing tag (applying the blue .btn-primary style. I've tried to apply the style during the select event (select2:select) event: $("#ticker_select").on('select2:select', function(e) { // If the e.params.data.id equals e.params.data.txt, // then it is a user-created tag! if (e.params.data.id == e.params.data.text) { // User-created tag; Mark the tag red $(".select2-selection__choice[title='

Add fontawesome icons into select2 V4 dropdown items

阅读更多关于 Add fontawesome icons into select2 V4 dropdown items

I am trying to display fontawesome icons in the Select2 v4 dropdown items. But the dropdown is displaying the html and not generating the actual icon. This method works with select2 V3 but does not seem to with v4. Any help is appreciated. Thank you 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

Select2 v4 unable to tab into, press enter, and then select, with Firefox (aka mouseless access)

阅读更多关于 Select2 v4 unable to tab into, press enter, and then select, with Firefox (aka mouseless access)

问题 I am currently unable to tab into a Select2 enabled <select> element in Firefox (38.0.5) - in other words, cannot access to select <option> in a mouseless manner. In Chrome, you can tab through a form and press enter in order to start selecting an item in the Select2 select element. I have not tested in other browsers, but before submitting an actual bug report I want to verify whether others are experiencing the same issue? You can duplicate on the demo page. Select2 v4.0.0 Twitter Bootstrap

Programmatic selection of select2 which retrieves its data via Ajax

阅读更多关于 Programmatic selection of select2 which retrieves its data via Ajax

问题 I am using select2 version 4.0, and I am trying to make a programmatic selection to a select box which gets its data from an ajax call. In the documentation, I found how to set a value programmatically to a regular select2, but I can't figure out how to do this with an ajax select. If I remember correctly, in the old version, you could set the current value by passing a data to the select2 with this command: jQuery("selectbox").select2("data", data) I've tried this, and sent a data object

Jquery Select2 plugin version check

阅读更多关于 Jquery Select2 plugin version check

In my project I check if the Select2 plugin was loaded in this way if (jQuery().select2) But now I will try to verify what kind of version (3.5.X or 4.X) of Select2 plugin was loaded. I thought maybe you could check if there is an option/function introduced in version 4.X that is not present in the version 3.5.X. According to you, is it doable? How might I do it? Thank you There is a new isOpen method in Select2 4.0. You can use something like this in your developer toolbar: try { $("#a-select2-element").select2('isOpen'); 'select2 v4.x'; } catch(e) { 'select2 v3.x'; } Tested with Select2 v3.5

Select2 default options with ajax

阅读更多关于 Select2 default options with ajax

I have next html structure <select class="change_item_dropdown_ajax form-control" id="item_id" name="item_id" onchange="updateData(this, this.value, 16)" > <optgroup label="System Data"> <option value="17">Test</option> <option selected="selected" value="18">System</option> </optgroup> </select> Javascript $(".change_item_dropdown_ajax").select2({ ajax: { url: "get_user_items", dataType: 'json', delay: 250, theme: "classic", data: function (params) { return { q: { name_contains: params.term } // search term }; }, processResults: function (data) { return { results: data }; }, cache: true },

Select2 4 custom data adapter

阅读更多关于 Select2 4 custom data adapter

I am trying to create a custom data adapter according to an example here: http://select2.github.io/announcements-4.0.html#query-to-data-adapter . How can I move the line that creates the select2 control outside the function with definition of DataAdapter (see the code below)? <!DOCTYPE html> <head> <title></title> <link href="select2.css" rel="stylesheet" /> <script type="text/javascript" src="http://code.jquery.com/jquery-2.1.4.js"></script> <script type="text/javascript" src="select2.full.js"></script> <script type="text/javascript"> $.fn.select2.amd.require( ['select2/data/array', 'select2

Using SELECT2 4.0.0 with infinite Data and filter

阅读更多关于 Using SELECT2 4.0.0 with infinite Data and filter

问题 I'm using Select2 now since 2 years and I really enjoy all dev made. however, version 3.5.x has his limit, so I'm moving to version 4.0, which give me headaches! For your record, I'm using Select2 with large table (> 10.000 entries), so AJAX & infinite data (page set to 50 items). With version 3.5.2, I can reproduce the underline match when searching for data (using formatSelection and query.term ). Any idea how to make it with version 4.0.0 (function templateResult only passes result and not