Hi

I am using angular 13.

My page contains a button "New Application"

I press a button to open the window "Search for applicant"

the window is open , it contains another buttton with label "continue"

I press the "coninue" button to open the action sheet. the action sheet is open at the back and attached to the parent page not to the window.

here is the HTML

<kendo-window
  title="Search For Applicant"
  *ngIf="opened"
  (close)="close()"
  [minWidth]="800"
  [width]="1200"
  [height]="650"
>
  <dhaman-entities></dhaman-entities>
  <kendo-dialog-actions>
    <button  id="openActionSheetBttn" kendoButton (click)="Start()" themeColor="primary">
      Continue..
    </button>
  </kendo-dialog-actions>
</kendo-window>
<kendo-actionsheet
*ngIf="openActionSheet"
(itemClick)="acOnItemClick()"
(overlayClick)="acOnOverlayClick()"
[title]="title"
[items]="items"
>
</kendo-actionsheet>

public openActionSheet = false;
  public title = 'Select item';
  public items: ActionSheetItem[] = [
    {
      title: 'Edit Item',
      iconClass: 'k-icon k-i-edit',
    },
    {
      title: 'Add to Favorites',
      iconClass: 'k-icon k-i-heart',
    },
  ];

.k-actionsheet-container {
  width: 100%;
  height: 100%;
  z-index: 1;
}
.k-actionsheet-container > .k-overlay {
  border-bottom-left-radius: 30px;
  border-bottom-right-radius: 30px;
}

Overview - GridLayout - Kendo UI for Angular (telerik.com)

Looking at the examples here, the grid is not laying out correctly and grid col's are being ignored.

Hi,

I wanted to use the treeview it does look the same like earlier. Its not right.

arrows are replaced with bulleted and checkbox is also added.

please look into this at the earliest.

Team,

Kendo Angular Editor seems erroring out with the following

Error: node_modules/@types/prosemirror-model/index.d.ts:1147:40 - error TS2709: Cannot use namespace 'OrderedMap' as a type.
1147     nodes: { [name in N]: NodeSpec } | OrderedMap<NodeSpec>;
                                            ~~~~~~~~~~
Error: node_modules/@types/prosemirror-model/index.d.ts:1154:41 - error TS2709: Cannot use namespace 'OrderedMap' as a type.
1154     marks?: { [name in M]: MarkSpec } | OrderedMap<MarkSpec> | null | undefined;                                            ~~~~~~~~~~

Error: node_modules/@types/prosemirror-schema-list/index.d.ts:44:40 - error TS2709: Cannot use namespace 'OrderedMap' as a type.
44     nodes: { [name in N]: NodeSpec } | OrderedMap<NodeSpec>,                                          

Error: node_modules/@types/prosemirror-schema-list/index.d.ts:47:81 - error TS2709: Cannot use namespace 'OrderedMap' as a type.
47 ): { [name in (N | "ordered_list" | "bullet_list" | "list_item")]: NodeSpec } | OrderedMap<NodeSpec>;

Here is the package.json

 "@progress/kendo-angular-buttons": "^7.0.6",
    "@progress/kendo-angular-common": "^2.0.3",
    "@progress/kendo-angular-dateinputs": "^6.0.3",
    "@progress/kendo-angular-dialog": "^6.0.2",
    "@progress/kendo-angular-dropdowns": "^6.0.2",
    "@progress/kendo-angular-editor": "^3.1.2",
    "@progress/kendo-angular-excel-export": "^4.0.4",
    "@progress/kendo-angular-grid": "^6.1.3",
    "@progress/kendo-angular-inputs": "^8.0.8",
    "@progress/kendo-angular-intl": "^3.1.3",
    "@progress/kendo-angular-l10n": "^3.0.4",
    "@progress/kendo-angular-label": "^3.1.3    ",
    "@progress/kendo-angular-menu": "^3.0.6",
    "@progress/kendo-angular-pdf-export": "^3.0.4",
    "@progress/kendo-angular-popup": "^4.0.6",
    "@progress/kendo-angular-toolbar": "^5.0.3",
    "@progress/kendo-angular-tooltip": "^3.1.6",
    "@progress/kendo-angular-treeview": "^6.0.2",
    "@progress/kendo-data-query": "^1.5.2",
    "@progress/kendo-drawing": "^1.16.3",
    "@progress/kendo-file-saver": "^1.1.1",
    "@progress/kendo-licensing": "^1.2.2",
    "@progress/kendo-recurrence": "^1.0.3",
    "@progress/kendo-theme-material": "^5.3.1",

These versions of kendo was working fine and started erroring out on the orderedmap from lastweek. The existing versions of our code is also erroring out after npm installs.  We are in the process of acquiring new license, so cannot immediately upgrade to the latest license.

Any help will be greatly appreciated.

Hello,

I'm currently working on displaying a list of items as a table. The user should be able to reorder the list using a drag handle in one of the cells. It should also be able to filter items, though reordering will only be enabled if no filter is applied.

I was trying to implement this using a Kendo Data Grid and the cdk drag and drop module. This didn't work very well together.

I also looked into the new Kendo Drag and Drop Utility, but this doesn't seem to be intended for reordering elements within a collection in the same way cdk is with cdkDropList.

Is there a way to do this using a grid?

I've found other posts about this topic:

• Drag & Drop Cell in Grid
• kendo-grid and material cdk drag/drop

They are already 2+ years old though so I was wondering if there are any developments regarding this functionality.

Thanks!

Using autoFocusedElement to auto focus the dialog elements when it open. The focus functionality is working as per expected. However i am getting Angular lifecycle error while i use kendo-floatinglabel for the kendo-textbox. 

Here is the stackblitz - https://stackblitz.com/edit/angular-oqmcb8?file=src%2Fapp%2Ftext.component.ts

Hi Team,

I attached my project with this question.

Can you look at the problem of anchor giving the error "Property 'nativeElement' is missing in type 'HTMLButtonElement' but required in type 'ElementRef<any>'"

StockBlitz also working fine. Only one doubt is Angular CLI version.

https://stackblitz.com/edit/angular-5yvop3-ddr4c8?file=app%2Fapp.component.ts

I'm using Angular CLI v12

Can you check the attached project and solve the issue!

<div class="example-config">
  <button #anchor (click)="onToggle()" class="k-button">
    {{ toggleText }} Popup
  </button>
</div>
<kendo-popup [anchor]="anchor" (anchorViewportLeave)="show = false" *ngIf="show">
  <div class="content">
    <!-- User-defined content -->
    Popup content.
  </div>
</kendo-popup>

Regards,

Srinivas M.P.

Attached files show error in line number 17, so not able to build angular project, any body can help?

Error: node_modules/@progress/kendo-angular-dateinputs/dateinput/dateinput.component.d.ts:17:29 - error TS2307: Cannot find module '@angular/forms/forms' or its corresponding type declarations.

17 import { FormControl } from '@angular/forms/forms';


 

My organization has complex use cases for the kendo grid that we depend on, hence we created a wrapper component that dynamically generates the columns given a column configuration array, which can include columns with child columns.

I have a working solution but it requires duplicating the ng-template for the column for standalone columns and columns within column groups. This is less than ideal because if we make a change, we need to make it in two places in the template, so the maintenance and testing costs are higher.

I put together an example that I was hoping would work, but it seems like the @ViewChildren in the ColumnGroupComponent does not find child column definitions that are dynamically inserted using *ngTemplateOutlet unless the ng-template it references is declared at the same level in the template. I'm not sure if this is simply a limitation of Angular, or if there's something different that the ColumnGroupComponent can do to query for dynamic child columns.

As a quick example, this works:

<kendo-grid-column-group
    title="{{ column.title }}"
    *ngIf="column.children?.length; else singleColumn"
>
    <ng-container *ngFor="let childColumn of column.children">
        <ng-container *ngTemplateOutlet="columnTemplate, context: { $implicit: childColumn }"></ng-container>
        <ng-template #columnTemplate let-col>
            <kendo-grid-column
                    field="{{ col.field }}"
                    title="{{ col.title }}"
                    format="{{ col.format }}"
                    [filter]="col.type"
            ></kendo-grid-column>
        </ng-template>
    </ng-container>
</kendo-grid-column-group>

But this does not work:

<ng-template #columnTemplate let-col>
    <kendo-grid-column
            field="{{ col.field }}"
            title="{{ col.title }}"
            format="{{ col.format }}"
            [filter]="col.type"
    ></kendo-grid-column>
</ng-template>
<kendo-grid-column-group
        title="{{ column.title }}"
        *ngIf="column.children?.length; else singleColumn"
>
    <ng-container *ngFor="let childColumn of column.children">
        <ng-container *ngTemplateOutlet="columnTemplate, context: { $implicit: childColumn }"></ng-container>
    </ng-container>
</kendo-grid-column-group>

Here's the minimal reproduction example as a reference: https://stackblitz.com/edit/angular-fnyxio?file=src/app/app.component.ts

It would be nice if the grid could support this, which would greatly simplify the code that we have to maintain.

Thanks!