[OPEN] [#1775] ListFilter -- select all option

  1. #1

    [OPEN] [#1775] ListFilter -- select all option

    Hi,

    Is there any easy way to add a select all checkbox to a grid column list filter?
    Thanks
    -susan
    Last edited by fabricio.murta; May 15, 2020 at 9:50 PM.
  2. #2
    Hi Susan!

    Why, isn't deactivating the filter exactly what you want? If you de-tick the checkbox in the filter's menu?

    Or do you want this to allow the user to select all and deselect just what they don't want to display?

    Are we talking about the filter you can get for column Size in this example?

    - GridPanel > Plugins > GridFilter Local

    Anyway, there's not a "builtin-easy-way" for that. But maybe a simple command (like, maybe ctrl+click, or long-press) could be assigned to check all options in the filter -- or an extra line to do so -- could be implemented with not so much effort.

    Please confirm I'm in line with your inquiry, then I may give this a try for you.
    Fabrício Murta
    Developer & Support Expert
  3. #3
    Hi Fabricio,

    Thanks for your quick response. You are right. My user wants to click the select all and then deselected a few from the long account key option list(see attached screenshot).
    Please advise.
    Thanks
    -susan

    Click image for larger version. 

Name:	image (1).jpg 
Views:	205 
Size:	102.1 KB 
ID:	25336
  4. #4
    Hello Susan!

    I took a look at the matter but I'm afraid a substantial development of the feature would need to take place before this can be achieved. If you are looking for means to get started, the component you should be extending is the Ext.grid.filters.filter.List. You can start by trying to override it; in case you get it working the way you need you can then consider making an extension. But no matter which path you chose it would need quite fundamental changes in how the plugin works.

    Here's how you could get started at overriding the component:

    Ext.define('extended-listfilter', {
        override: 'Ext.grid.filters.filter.List',
        createMenuItems: function () {
            var me = this,
                menu = me.menu;
    
            me.callParent(arguments);
    
            // Save something to indicate the current state of the 'all' check item
            // to know when it is changing in a setValue() call
            me.checkAllChecked = false; // initially not checked
        },
        setValue: function () {
            var me = this,
                items = me.menu.items,
                value = [],
                changedAllCheckbox = false,
                i, len, checkItem;
    
            // logic to handle when 'all' is checked, or to uncheck 'all' if any member is unchecked
    
            // if the checked item was not "all", then proceed with normal "set value" for the filter
            if (!changedAllCheckbox) {
                me.callParent(arguments);
            }
        }
    });
    You can check how the original codes work to get hints on how you could manipulate it if you step into these me.callParent() calls with your JavaScript debugger.

    Inspecting the setValue() method may also hint you in even easier ways to just check everything "from outside" if you'd rather just create a button to check everything from a grid panel's click (bear in mind the menu is only written once the menu is expanded the first time so some parts of the component may be absent if the button is clicked before the menu is expanded once).

    I hope this helps, and sorry I couldn't put up a simple code showing you how to do this in its entirety; I tried a couple alternatives but all them turned out to be too complex to be finished in a timely manner.
    Fabrício Murta
    Developer & Support Expert
  5. #5
    Hi Fabricio, Thank you so much for your advice. Since this is not our urgent request, I can wait a bit more time. Do you think the 7.x or future version may have this feature?
    Thanks
  6. #6
    Hello again, Susan!

    Ext.NET 7 could get this feature at some point but the initial release is focused in properly implementing Ext JS framework and all development Ext.NET includes. So, for subsequent versions there may be room for this feature from our own -- if Sencha doesn't implement this by their side in the meanwhile.

    I've logged an entry in our issues tracker to document your request. It is logged under issue #1775 and we'll post a follow up here as soon as it gets implemented.

    Hope this helps!
    Fabrício Murta
    Developer & Support Expert
  7. #7
    That is great to know.* * Thank you again.* *
    Please close this thread.
    Thanks
    -susan
  8. #8
    Hello once again, Susan!

    As we logged a feature request, we will keep the 'open' tag in the thread until we respond it with the feature implemented. So we don't forget to leave feedback once it is implemented.

    Thanks for understanding and, in case you try something on the lines we suggested above and get stuck at some point, let us know. We will help you out!
    Fabrício Murta
    Developer & Support Expert

Similar Threads

  1. [CLOSED] "Select All" option in MultiCombo
    By pj_martins in forum 1.x Legacy Premium Help
    Replies: 5
    Last Post: Oct 31, 2013, 9:13 PM
  2. [CLOSED] How to select a ComboBox option in Direct Method?
    By vadym.f in forum 2.x Legacy Premium Help
    Replies: 2
    Last Post: Aug 14, 2013, 5:21 PM
  3. Replies: 6
    Last Post: Jan 12, 2011, 2:37 PM
  4. Select all option in MultiCombo
    By skrishnasamy in forum 1.x Help
    Replies: 0
    Last Post: Aug 12, 2010, 7:02 AM

Posting Permissions