Adminlte: Select2 is not working on touch devices

Created on 22 Nov 2015  路  9Comments  路  Source: ColorlibHQ/AdminLTE

I am using v2.3.0 of AdminLTE. In this the Select2 (v4.0) dropdowns are not opening on mobile devices. I tested on Chrome developer tools as well as Safari on iOS 9.

question

Most helpful comment

Its an issue with Select2 and Fastclick. After adding 'needsclick' class to all child span elements of 'select2', its working fine as expected.

$('.select2 span').addClass('needsclick')

All 9 comments

I tested in with 2.3.2 on an iPhone 5C. It works, you have to press a bit longer than for a normal click event.

Check this select2/select2#3064

It seems like a select2 issue. It should've been solved in the recent version. Try upgrading the current select2 to the latest release.

Its an issue with Select2 and Fastclick. After adding 'needsclick' class to all child span elements of 'select2', its working fine as expected.

$('.select2 span').addClass('needsclick')

Found a fix. You can replace fastclick.js with the following
https://raw.githubusercontent.com/ftlabs/fastclick/569732a7aa5861d428731b8db022b2d55abe1a5a/lib/fastclick.js

Now Select 2 and Fastclick both works like a champ. Happy coding.

I had tried a lot on this issue, you had resolved it in fraction of second... smart solution !!!
Thanks @sajeelmuhammed

I am using Select2 V3.5.3 and I notice there is an issue when using the select2 control on mobile devices (iPhone iOs 7 to be exact). When using the search feature, the virtual keyboard keeps popping up after the search results are displayed. (Clicking "Done" after the search results appear does nothing; the virtual keyboard just keeps popping up and obscuring much of the search results, making it difficult to scroll through the results).
I searched this forum and found some suggestions that I tried - to no avail. Does anyone know if this issue has been fixed in select2 Version 4? Appreciate any feedback.

I will try to update the gem and see if it fixes this problem.

Try below 2 code scripts as it worked to me after wasting lots of hours.

        var ele = $('#control_name');

        // gaurav jain: quick fix for select2 not closing on mobile devices
        ele.on("select2:close", function () {
            setTimeout(function () {
                $('.select2-container-active').removeClass('select2-container-active');
                $(':focus').blur();
            }, 1);
        });

        // gaurav jain: quick fix for select2 not opening on mobile devices if with textbox
        ele.on('select2:open', function () {
            $('.select2-search__field').prop('focus', false);
        });
Was this page helpful?
0 / 5 - 0 ratings

Related issues

lenamtl picture lenamtl  路  3Comments

vbetancourt picture vbetancourt  路  3Comments

frlinw picture frlinw  路  3Comments

akbajwaakgec picture akbajwaakgec  路  3Comments

REJack picture REJack  路  3Comments