Keep the select all option when filtering

Progress® Kendo UI® for jQuery Feedback Portal

Create an account Log In

Back to Feed

Request a Feature Report a Bug

Unplanned

Last Updated: 16 Dec 2020 10:25 by ADMIN

Mark

Created on: 11 Dec 2020 10:03

Category: Grid

Type: Feature Request

Keep the select all option when filtering

Hi,

Hopefully you can help us out with this!

On Kendo Grid, when filtering, we have an option 'Select All' as you can see below.

Now if we run a search for 'B' we get the below:

Now the select all option has disappeared and in some cases we would have a lot of options to enable.

Any ideas?

Thanks

Mark

3 comments

ADMIN

Alex Hajigeorgieva

Posted on: 16 Dec 2020 10:25

Hi, Mark,

I have converted this to a Public Feedback item and added the votes from the people who were asking about this functionality.

Kind Regards,
Alex Hajigeorgieva
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Mark

Posted on: 16 Dec 2020 08:56

Hi Alex,

Yes please go ahead and convert it to a public feedback portal item. Hopefully it will get the upvotes :)

Your fix looks like its working perfectly too so thanks for that.

Mark

ADMIN

Alex Hajigeorgieva

Posted on: 16 Dec 2020 08:21

Hello, Mark,

Thank you for the provided explanations.

Currently, there is no built-in way in which we can keep the 'Select All' checkbox, however I think this would be a great enhancement to the FilterMultiCheck. If you do not mind it, I would like to convert this thread to a public Feedback Portal item so others can upvote it. I found a forum thread where others have asked for this functionality, so I believe it has a reasonable chance to become popular.

https://www.telerik.com/forums/help-grid--'filter-search'-keep-'select-all'

Meanwhile, if you want to achieve it, you will need to override some Kendo internal functions that will help keep the select all checkbox visible and its state updated accordingly:

kendo.ui.FilterMultiCheck.fn.checkAll = function(){
            var state = this.checkBoxAll.is(":checked");
            this.container.find(":checkbox:visible").prop("checked", state);
          }

          kendo.ui.FilterMultiCheck.fn.updateCheckAllState =  function() {
            if (this.options.messages.selectedItemsFormat) {
              this.form.find(".k-filter-selected-items").text(kendo.format(this.options.messages.selectedItemsFormat, this.container.find(":checked:not(.k-check-all)").length));
            }
            if (this.checkBoxAll) {
              var state = this.container.find(":checkbox:not(.k-check-all):visible").length == this.container.find(":checked:not(.k-check-all):visible").length && this.container.find(":checkbox:not(.k-check-all):visible").length !==0;
              this.checkBoxAll.prop("checked", state);
            }
          }

And styles:

 <style>
      .k-multicheck-wrap .k-item:first-child {
        display:inline-block !important;
      }
        .k-multicheck-wrap {
          overflow-x: hidden;
        }
      </style>

Here is a runnable example for your reference:

https://dojo.telerik.com/@bubblemaster/adEHOPaD

Let me know what you think.

Kind Regards,
Alex Hajigeorgieva
Progress Telerik