Questions on Kendo UI for Angular Forum

0 answers

11 views

Kendo Angular Multiselect - Cap max items selected

I want to impose a limit on how many items a user can select in a multiselect, but I don't see any documentation for this. For the jQuery multiselect I see it has a maxSelectedItems, but there's nothing like that in the Angular version. How can I use the (valueChange) event to cap the selected items?

MultiSelect

asked on 18 Dec 2025

1 answer

23 views

kendoGridToolbarFocusable works for kendo-dropdownlist but not kendo-multiselect

kendo 19.3.0, angular 19.2.17.

applying kendoGridToolbarFocusable to kendo-dropdownlist gives it the correct behavior to stay focused on click but this same behavior did not work for kendo-multiselect. it stays open so long as the click is held in but once released it closes. if the mouse is hovered over the dropdown that opens AND THEN released, the multiselect stays open and has intended behavior after selecting items.

kendoGridFocusable was also tried in this scenario and did not produce results.

<ng-template kendoGridToolbarTemplate>
<kendo-dropdownlist style="min-width:220px; margin-right:5px; margin-left:5px"
                    kendoGridToolbarFocusable
                    [data]="names"
                    (valueChange)="handleApplyAllValueChange()"
                    [defaultItem]="defaultApplyAllItem"
                    [textField]="'nm'"
                    [valueField]="'id'"
                    [(ngModel)]="applyAllItem"
                    [hidden]="isRevisedRadioButton()">
</kendo-dropdownlist>
<kendo-multiselect style="min-width:220px; max-width:220px; max-height: 140px; overflow-y: auto"
                   kendoGridToolbarFocusable
                   [data]="applyAllSecondaryList"
                   [textField]="'nm'"
                   [valueField]="'id'"
                   [disabled]="isApplyAllSecondaryDisabled()"
                   [autoClose]="false"
                   [(ngModel)]="applyAllSecondaryItem"
                   [placeholder]="'Select Secondary'"
                   [hidden]="isRevisedRadioButton()">
  <ng-template kendoMultiSelectTagTemplate let-dataItem kendoGridToolbarFocusable>
    {{ dataItem.deviationNm }}
</ng-template>
</kendo-multiselect>
</ng-template>

answered on 08 Dec 2025

2 answers

1.0K+ views

MultiSelect with drag and drop of selected items to reorder them

Is it possible to do this?

I see I can customise individual items, but they would need to be in a Sortable container in order for drag / drop to work. Is there any way of achieving this?

Thanks

MultiSelect

answered on 28 Aug 2025

1 answer

34 views

Grid multi-row selection on Android

While working and testing on android using a grid, I've ran into an issue with multiple row selection. I define the grid as:

[selectable]="{enable: true, mode: 'multiple'}"

This works on PC, and on iOS (via the two-finger gesture). On android this does not work, as the gesture doesn't exist.
What is the best way the handle this issue? Add a checkbox column for android so users select multiple rows using the checkbox? define a custom gesture and try to handle it?

Grid

MultiSelect

answered on 11 Jul 2025

0 answers

85 views

How can I filter multiple date range in kendo grid

I have a date list which is binding in kendo grid. I what to filter multiple date range like 1st January 2025 to 31st January 2025 and 1st May 2025 - 31st May 2025. Can kendo grid support multi date range filter? If support, then how to implement it.

asked on 24 Apr 2025

0 answers

85 views

CTL/ Shift multiselection with large data and columns

Hello,

I'm working on a project where we have about 100 columns and rows can exceed 1000 rows.

The users want to enable CTL and shift selection but it doesn't work and I have 2 behaviors:

1- If I click quickly and simultaneously CTL and Select row it's works.

2 - If I start holding the CTL button and try to select row nothing happen and it takes long time to be selected.

can you tell me what the problem is exactly and if there is a bypass for it

Best regards

Grid

MultiSelect

asked on 01 Nov 2024

1 answer

1.0K+ views

selectedKeys is not working after update kendo packages

I've prepared kendo grid with multiselection and everything was fine until I updated kendo packages:

Old versions:

"@progress/kendo-angular-buttons": "^5.5.2",
"@progress/kendo-angular-common": "^1.0.0",
"@progress/kendo-angular-dateinputs": "^4.3.2",
"@progress/kendo-angular-dialog": "^4.2.3",
"@progress/kendo-angular-dropdowns": "^5.5.0",
"@progress/kendo-angular-editor": "^1.2.4",
"@progress/kendo-angular-excel-export": "^3.1.5",
"@progress/kendo-angular-grid": "^4.8.4",
"@progress/kendo-angular-inputs": "^6.4.0",
"@progress/kendo-angular-intl": "^2.0.4",
"@progress/kendo-angular-l10n": "^2.0.0",
"@progress/kendo-angular-label": "^2.3.3",
"@progress/kendo-angular-layout": "^4.2.0",
"@progress/kendo-angular-listview": "^0.2.0",
"@progress/kendo-angular-menu": "^2.0.4",
"@progress/kendo-angular-notification": "^2.1.3",
"@progress/kendo-angular-pager": "^1.0.0",
"@progress/kendo-angular-pdf-export": "^2.0.4",
"@progress/kendo-angular-popup": "^3.0.0",
"@progress/kendo-angular-progressbar": "^1.0.0",
"@progress/kendo-angular-toolbar": "^3.2.1",
"@progress/kendo-angular-tooltip": "^3.0.0",
"@progress/kendo-angular-treelist": "^2.0.0",
"@progress/kendo-angular-treeview": "^5.4.2",
"@progress/kendo-angular-upload": "^6.1.0",
"@progress/kendo-data-query": "^1.5.4",
"@progress/kendo-drawing": "^1.5.12",
"@progress/kendo-theme-default": "^4.23.0",
"@progress/kendo-licensing": "^1.2.1",
After update operation:
"@progress/kendo-angular-buttons": "^8.0.0",
"@progress/kendo-angular-common": "^3.1.0",
"@progress/kendo-angular-dateinputs": "^7.0.1",
"@progress/kendo-angular-dialog": "^7.1.2",
"@progress/kendo-angular-dropdowns": "^7.0.2",
"@progress/kendo-angular-editor": "^4.1.3",
"@progress/kendo-angular-excel-export": "^5.0.1",
"@progress/kendo-angular-grid": "^7.2.3",
"@progress/kendo-angular-inputs": "^9.0.3",
"@progress/kendo-angular-intl": "^4.1.0",
"@progress/kendo-angular-l10n": "^4.0.0",
"@progress/kendo-angular-label": "^4.0.0",
"@progress/kendo-angular-layout": "^7.1.0",
"@progress/kendo-angular-listview": "^4.0.0",
"@progress/kendo-angular-menu": "^4.0.0",
"@progress/kendo-angular-notification": "^4.0.0",
"@progress/kendo-angular-pager": "^4.0.1",
"@progress/kendo-angular-pdf-export": "^4.0.0",
"@progress/kendo-angular-popup": "^5.0.0",
"@progress/kendo-angular-progressbar": "^3.0.0",
"@progress/kendo-angular-toolbar": "^6.0.2",
"@progress/kendo-angular-tooltip": "^4.0.1",
"@progress/kendo-angular-treelist": "^5.0.3",
"@progress/kendo-angular-treeview": "^7.1.0",
"@progress/kendo-angular-upload": "^9.0.2",
"@progress/kendo-data-query": "^1.6.0",
"@progress/kendo-drawing": "^1.16.3",
"@progress/kendo-theme-default": "^5.5.0",
"@progress/kendo-licensing": "^1.2.2",
My Kendo Grid properties:
  <kendo-grid  
  [selectable]="selectableSettings"
  (selectedKeysChange)="keyChange($event)"
  kendoGridSelectBy="id"
  [selectedKeys]="mySelection"
  >
Before update everything was fine I mean, I had correct objects (ids) into mySelection array number property.
Defined property into component:
    mySelection: number[] = [];
Selectable settings:
        this.selectableSettings = {
          checkboxOnly: true,
          mode: "multiple"
        };
KeyChange method:
    keyChange(e){
        this.closeEditor();
        if(e.length > 0) {
            this.isSelectionDisabled = false;
        } else {
            this.isSelectionDisabled = true;
        }
        this.extractDataItems = [];
        this.extract();
    }
Extract method:
    extract() {
        this.mySelection.forEach(idx => {
            this._subs.add(
                this.timeBookings$.pipe(
                    map(items => items.find(item => item.id === idx)
                )).subscribe(r => {
                    if(this.mySelection.length > 0 && r) {
                        this.extractDataItems.push(r);
                    }
                })
            );
        });
    }
Important!
When I'm selecting some rows - mySelection is always empty.
I know that in keyChange(e) method I can do something like:
this.mySelection = e;
and everything will work as should but why it was working correctly before update and after not?
Parameter of:
keyChange(e) - parameter e has correct value all the time

Grid

MultiSelect

answered on 08 Oct 2024

2 answers

418 views

Strange characters in different Kendo objects

We are noticing these characters "â€<" showing up intermittently after updating our kendo-angular dependencies to 15.5.0.
It's not an issue we are able to reproduce every day, and sometimes reloading will fix it, but it will appear at the beginning of kendo window headers, and options in kendo dropdowns. We have not changed anything about our code, nor are we using any special characters ourselves in these locations.

Our angular version is 17.3.12

Is this a known issue? What would the fix be?

Thanks.

answered on 02 Oct 2024

3 answers

3.0K+ views

multiselect with icon of choosing

Hi, I'm trying to create a multi-select item that will have the outside look & behavior of a simple dropdown-list, including using icon of my choosing for the down arrow.

But I'm having trouble locating the icon, I've tried using plain css and play with the positions of the items, but then the icon doesn't stick to the corner of the multi-select wrapper..

Would like some help, I feel like maybe I'm doing it all wrong.

Here is my code:

https://stackblitz.com/edit/angular-kendo-multi-dropdown-look

MultiSelect

answered on 22 May 2024

1 answer

95 views

LoadMoreDirective for MultiSelectTree?

I am presently utilizing a MultiSelectTree to display an extensive hierarchical dataset. Despite employing load on demand, performance suffers notably when a single level contains numerous elements.

I have come across a solution tailored for the TreeView to address this concern, wherein a limit for elements per level can be set, accompanied by a "load more" button once the limit is reached.

Is there a way to adapt this solution for the MultiSelectTree? Alternatively, are there other remedies available for optimizing performance with the MultiSelectTree?

MultiSelect

TreeView

answered on 12 Apr 2024