Search pane not working on mobile

Search pane not working on mobile

balabonbalabon Posts: 8Questions: 1Answers: 0

Link to test case: https://piwko.com.pl/drozdze
Debugger code (debug.datatables.net): tried to send, but debugger upload script got error 500
Error messages shown: no error
Description of problem: search panes works on dekstop, but not on mobile (android + chrome). There is no error. I've tried to disable all JS except jQuery to avoid posiible coflicts with no luck. Any idea why you can select filter on mobile but there is no filtering? Search input seems to work, but not every time.

This question has an accepted answers - jump to answer

Answers

  • balabonbalabon Posts: 8Questions: 1Answers: 0
    edited January 2021

    This table configuration:

    (function ($) {
        $(document).ready( function () {
            var datatable_table = $('#datatable-table').DataTable({
    
                dom: 'Pfript', //P for panes, B for buttons
                paging: false,
                responsive: true,
        
                searchPanes:{
                    layout: 'columns-4',
                    columns: [1,2,3,4,5,6,7,8],
                    viewTotal: true,
                    controls: false,
                    cascadePanes: true,
                    dtOpts: {
                        select: {
                            style: 'multi'
                        }
                    }
                    //orderable: false
                }
    
            });
    
            $('#datatable-table_filter .form-control').attr("placeholder", "Np.: fermentum płynne ipa");
    
        });
    })(jQuery);
    

    Edited by Colin - Syntax highlighting. Details on how to highlight code using markdown can be found in this guide.

  • colincolin Posts: 15,240Questions: 1Answers: 2,599

    I just tried it on my HTC 11 (Android 9) and it works as expected there. What hardware/OS are you using?

    Colin

  • balabonbalabon Posts: 8Questions: 1Answers: 0

    Thanks! I'm using android 6.0 with Google Chrome. Hardware LeTV leeco le pro 3 AI but few peoples had same issue. I've checked click event with JS alert and it works, so there is another issue.

  • balabonbalabon Posts: 8Questions: 1Answers: 0

    Update: I've tried with docs example, it works, so it is not hardware/browser issue.

  • colincolin Posts: 15,240Questions: 1Answers: 2,599

    When you say it doesn't work, what exactly happens? Are you seeing empty panes, or no panes? Could you take a screenshot and post here, please.

    Colin

  • balabonbalabon Posts: 8Questions: 1Answers: 0

    Everything looks normal, I see the panes, can select options, but nothing happens, there is no filtering. Table has 210 rows, when you select any filter, you can still see all 210.

  • balabonbalabon Posts: 8Questions: 1Answers: 0


    Here I should see only 2 rows, but there is 210 (all).

  • colincolin Posts: 15,240Questions: 1Answers: 2,599

    OK, that's helpful information... However, I'm still seeing it filter correctly on my phone, the same as it does on a desktop. Can you try it in an incognito browser, that'll determine if there's an browser extension interfering with it.

    Colin

  • balabonbalabon Posts: 8Questions: 1Answers: 0

    Besided that I have no extensions on my mobile Chrome, I've already tried that with no luck. I've checked also the order of the scripts (jQuery, datatables, datatables config).
    Now I'm trying with mobile Firefox, it works. The problem seems to be related with mobile Chrome (84.0.4147.111)

  • balabonbalabon Posts: 8Questions: 1Answers: 0

    I've forced Chrome update. Update did the trick. Now it is working. Thanks! ;)

  • colincolin Posts: 15,240Questions: 1Answers: 2,599
    Answer ✓

    Tops, we get there :smile: It does seem odd not to work in that version. We'll take a look still and see if there's anything that we can do.

    Colin

This discussion has been closed.