I'm implementing a search form using an ngbDropdown and the form contains a kendo-dropdownlist (to select what object type they want to search)

Unfortunately, when I select an option from the dropdown list, the menu closes. "autoClose" set to "false" works, but gives unwanted behaviour (in that the form itself almost never goes away). Worse, "autoClose" set to "outside" makes no difference.

Is there something I'm doing wrong?

Just to give an idea of what I'm doing, this is the beginning of the code (using Kendo 17.3.12):

<div ngbDropdown [autoClose]="'outside'" #searchMenu="ngbDropdown">
  <div id="searchMenuInner" ngbDropdownToggle>
    <span class="fa-solid fa-magnifying-glass"></span>
  </div>
  <div ngbDropdownMenu aria-labelledby="searchMenuInner">
    <div ngbDropdownItem>
      <div class="menu-header">Search</div>
      <div class="menu-item">
        <kendo-dropdownlist #searchType [data]="searchableItems"

I got a kendo Popup and inside a kendoFilter + kendoGrid.

Everything works well except when I press enter key when positioned inside the text field of one fitler row. The popup just close... DO I have a way to intercept this enter keypress and do something else ?

Thanks

In one of the recent releases (not sure from which release), even if we remove role SpinButton using renderer2.removeAttribute, in the ngAfterViewInit life cycle hook, after the kendo numeric textBox is rendered, the role spinButton is not going away from Kendo Angular Numeric TextBox. Any settings we need to do if we do not want this role?

What i tried can be seen in the sample below https://stackblitz.com/edit/angular-vfzhozgv . This is for 18.2.0. But, may be already working fine in latest version

Hello,

We encountered a problem inside our app while using the kendo-treelist component.

As shown in the video attached, we use a template to edit the values in the tree, which is either kendo-dropdownlist or kendo-numerictextbox. At the press of the kendo-icon-wrapper, which contains that arrow SVG icon (for increasing/decreasing the value or selecting from the dropdown), the whole row will either collapse or expand depending on the current state that it has.

From debugging, we believe that because the same SVG icon has been used, it might trigger the collapsing/expanding.

After adding a kendo-icon-wrapper component inside that cell, we could observe the same behaviour when pressing next to the 'test' text.

We are looking for a solution to this problem.

Thank you in advance.

Hi,

We need advice on how to add "id" and "for" reference attributes to custom angular components and associated kendo labels.

We use custom controls, that implement the ControlValueAccessor interface. We would like to use them with associated kendo-labels.

There is a good documentation here:

https://www.telerik.com/kendo-angular-ui/components/labels/label/association#other-angular-components

However it is not sufficient for our case. We need to keep WCAG conformity (level AA), means, the Html label element and the Html input element should be connected by attributes for and id, e.g.:

<label for="someId">Input here</label>
<input id="someId">

With standard kendo label and kendo input controls, these reference attributes for the inner Html elements are added by some kendo magic.
This however does not work if the kendo input control is wrapped in a component.
The accessability testing tools (e.g. WAVE, AInspector) mark this as an error.

Can someone propose a solution, on how to get the proper attributes onto the Html elements, or does anyone know a good and usable workaround (final ressort would be to set aria-label to the inner input element ...).

I attach a codesandbox  link which extends the kendo documentation mentioned above, and a screenshot with WAVE test result for the code snippet.

Thank you in advance.

https://codesandbox.io/p/sandbox/exciting-water-s8hp6k

After upgrading to angular 19 and kendo angular grid to version 17. it's throwing this error.

can't find this service in kendoAngular 17 version "PagerContextService!" Checkbox is also not showing in grid.

No provider for PagerContextService!

Hello,

I'm using the Kendo Angular Gantt chart, using flat binding since that's how the data is stored in my database.  A lot of the example code for editing tasks, dragging tasks, etc. rely on using the subtasks property on the Task to determine if the parent start/end dates or the completionRatio needs to be updated.

What is the best way to calculate the new start/end date or completionRatio when using flat binding?  I know that I could make a call to the database to calculate this, but would prefer to calculate this locally if possible.  Thanks!

public onDragEnd(e: TaskDragEvent, gantt: GanttComponent): void {
    const originalItem = { ...e.item.dataItem };
    const editedItem = {
      ...originalItem,
      start: e.start,
      end: e.end,
      completionRatio: e.completionRatio,
    };

    const taskFormGroup = this.createFormGroup(editedItem);
    if (!taskFormGroup.valid) {
      // You can notify the user that the edited item is invalid.
      return;
    }
    // Update the edited item
    Object.assign(e.item.dataItem, {
      start: e.start,
      end: e.end,
      completionRatio: e.completionRatio,
    });

    // Edit the ancestor items accordingly if necessary
    if (this.anyChanged(originalItem, editedItem)) {
      let currentItem = e.item.parent;

      while (currentItem) {
        const dataItem = currentItem.dataItem;
        const subtasks = dataItem.subtasks;

        dataItem.completionRatio =
          subtasks.reduce((acc, curr) => acc + curr.completionRatio, 0) /
          subtasks.length;
        dataItem.start = new Date(Math.min(...subtasks.map((t) => t.start)));
        dataItem.end = new Date(Math.max(...subtasks.map((t) => t.end)));

        currentItem = currentItem.parent;
      }
    }
    gantt.updateView();
  }

https://stackblitz.com/edit/angular-xqqm6evd?file=src%2Fapp%2Fapp.component.ts

I took the sample grid from the examples for Filter Menu, and then modified the UnitPrice to reflect a % instead of price.

I'm noticing something strange. When I try to filter, I need to filter on the raw value (so, for 4%, I need to filter on 0.04). This is fine and expected (although, bonus points if there is an option to have the filte reflect the display value, so user just needs to filter on "4").

However, when I start typing in 0.04, it seems that the filter component is resetting the field when enabling the "Filter" button if you're not fast enough. So, for example, you type in "0.0", the button enables, the component evaluates "0.0" and resets it to "0", losing the decimal. This is making it really frustrating to filter on these values.

If you do it fast enough, you can avoid this and filter as expected.

Any thoughts on how to fix this, or pereferably how to get it to filter based on the percentage itself?

Hello!

Currently, <kendo-upload> only allows to specify URLs for save and remove methods, which can be a problem sometimes. For example, when you deal with 3rd party API library where all the URLs are dynamic and encapsulated in library methods. So we cannot provide a URL to the component, but we could call the method instead to upload the file and report the progress on the files. Currently, <kendo-upload> doesn't allow that. I can intercept (upload) event and prevent default behavior, adding my own server call and custom logic, but there is no API in <kendo-upload> that will tell the component that the upload is started, or to report the upload progress on individual files, the whole component will be just unfunctional.

We were trying to replicate the auto-upload behavior using <kendo-fileselect> component, but it lacks the ability to change the dropzone hint or entire dropzone template without heavy uplifting of adding localization support to the app.

Are there any plans of adding more flexibility to <kendo-upload> and <kendo-fileselect> components?