Forums › Forums › Search & Filter Pro › Conflict Select2

Tagged: ,

Viewing 10 posts - 1 through 10 (of 10 total)
  • Anonymous
    (Private)  January 20, 2020 at 3:41 pm #231587

    Hi
    I need to resolve a serious conflict with my theme, I have looked into all the support discussions, but have found nothing that could help me.
    The problem is that using | Select2 | a DOM event is triggered in “class =” select2 select2-container select2-container – default select2-hidden-accessible ” and this breaks my Search Filter and the only way to restore the filter is a page refresh. It’s days that I try to solve this without any success, I know so much that you can help me.

    Anonymous
    (Private)  January 20, 2020 at 3:51 pm #231588
    This reply has been marked as private.
    Trevor
    (Private)  January 20, 2020 at 4:08 pm #231593

    What steps do I need to take to see the error?

    Anonymous
    (Private)  January 20, 2020 at 4:12 pm #231597

    you can also simply do “inspect element” the filter will break instantly

    Trevor
    (Private)  January 20, 2020 at 5:44 pm #231599
    This reply has been marked as private.
    Anonymous
    (Private)  January 20, 2020 at 5:51 pm #231603
    This reply has been marked as private.
    Anonymous
    (Private)  January 21, 2020 at 12:06 am #231634

    it seems that I found the problem…
    In my Javascript I found this function:

    —————————————
    function prepare_responsive() {
    var headerwidth = $(window).width();
    if(isphone || headerwidth <= start_mobile_size) {
    window.isMobile = true;
    } else {
    window.isMobile = false;
    }

    if(isphone || headerwidth <= start_mobile_size) {
    if($(‘.select2’).length) {
    $(‘select.select2-hidden-accessible’).select2(‘destroy’);
    }
    } else {
    if($(‘.select2’).length) {
    $(‘.select2’).select2({minimumResultsForSearch: 20, width: ‘auto’, dropdownAutoWidth : true});
    }
    }

    if(isphone || headerwidth <= start_mobile_size) {
    // responsive images in profile page
    // only show the images if they are in viewport
    function show_profile_images() {
    if($(‘.mobile-ready-img’).length) {
    $(‘.mobile-ready-img’).each(function() {
    if(isElementInViewport($(this)) && (!$(this).attr(‘src’) || $(this).attr(‘src’) != $(this).data(‘responsive-img-url’))) {
    $(this).css(‘opacity’, ‘0’).attr(‘src’, $(this).data(‘responsive-img-url’)).fadeTo(‘slow’, 1);
    }
    });
    }
    }
    show_profile_images();
    $(window).scroll(function(event){
    if(isphone || headerwidth <= start_mobile_size) {
    show_profile_images();
    }
    });
    —————————————

    What I have done at the moment is to clear the block:
    —————————————
    if(isphone || headerwidth <= start_mobile_size) {
    if($(‘.select2’).length) {
    $(‘select.select2-hidden-accessible’).select2(‘destroy’);
    }
    } else {
    if($(‘.select2’).length) {
    $(‘.select2’).select2({minimumResultsForSearch: 20, width: ‘auto’, dropdownAutoWidth : true});
    }
    }
    —————————————

    I’m not sure that clearing the block is correct and I’m wondering if there is a way to bypass without deleting.

    Trevor
    (Private)  January 21, 2020 at 8:49 am #231645

    Are you able to identify where the theme uses select2?

    The jQuery selectors used could be made more specific. The code is too generic at the moment.

    Let me give you an example. This code:

    if($('.select2')

    If the select2 components are always within containing divs with the class of mythemeform, the jQuery selector could be:

    if($('.mythemeform .select2')

    Anonymous
    (Private)  January 21, 2020 at 1:02 pm #231679

    ok I understand, at the moment I can’t understand where the theme uses “select2”.
    For now I will just comment on the block and as soon as I find out where it is used I will look for a definitive solution.
    For the moment I thank you ! We can close this discussion.

    Trevor
    (Private)  January 21, 2020 at 1:21 pm #231681

    Thanks for getting back to me. I will close this thread for now.

  • Author
    Posts
Viewing 10 posts - 1 through 10 (of 10 total)