Hello,

In our application, we offer the users possibility to customize settings and save them inside MongoDB, and some of those settings are of DateTime/Time type. 

The problem is, that when the user sets a time inside the DateTime Picker (let's say 17 April 2020, 23:59), the value saved inside MongoDB is the serialized one, 2020-04-17T20:59:00.000Z  (I write the ngModel in console and I get Fri Apr 17 2020 23:59:00 GMT+0300 (Eastern European Summer Time), so the serialization is correct considering the time zone, but we need to save in database the exact date the users sets inside the DateTimePicker.

console.log(this.dateModel, JSON.stringify(this.dateModel)) writes
Fri Apr 17 2020 00:00:00 GMT+0300 (Eastern European Summer Time)
'"2020-04-16T21:00:00.000Z"'

What can be done so the DateTimePicker shows the date with the same time as when it is serialized?

PS. We have same functionality in an older application made with AngularJS, but there is no problem because the Date Picker for jQuery UI accepts strings as ng-model.

Thanks,

Iuliana

I have multiple grids in a view and when the user drags on the scrollbar of one grid I want it to automatically scroll the other grids exactly the same amount up or down.

So in my ngAfterViewInit() method I have the following:

document.querySelector(".k-grid .k-grid-content").addEventListener("scroll", (e) => {

console.log('scroll event', e);

}

The idea is that I can then capture this event and pass it to the other grids so they can scroll too. However this isn't working as the event listener doesn't fire. Can you suggest a way to make this work?

Hello

I have a question. On click of a label, I want my kendo numeric textbox to have focus, but it is not working. Following is my code.

<label for="kid">Currency</label>

<kendo-numerictextbox
  [attr.id]="'kid'"
  [format]="formatOptions"
  [min]="min"
  [max]="max"
  [step]="step"
  [autoCorrect]="true"  
  [spinners]="false"
  [formControl]="control"
  [changeValueOnScroll]="false"
>
</kendo-numerictextbox>

Issue is because, at the run time kendo generates a random ID, and appends that ID to the input box(.k-input) , instead of appending the id given by the user as above. This is causing the issue and focus is not set on input box when clicking in label. Could you please check it and suggest a solution.

"@progress/kendo-angular-inputs": "^9.0.0",

Thank you

Hello, I updated all kendo packages today (June 6, 2022) and my ThemeService and other modules do not compile, this message appears:

      Error: Module not found: Error: Unable to resolve '@progress/kendo-angular-charts/common/theme.service', before update work with @progress/kendo-angular-charts, but now the only suggestion is @ progress/kendo-angular-charts/common/theme.service

6.0.1 was working fine. but the 7.1.0 no 

i deleted node_modules and removing package-lock.json alone didn't help

Regards

Claudio

Hi Telerik team.

I faced an issue with multi-days events displayed one day shorter on the month view than the endDate setup. For example event start date 2022-06-06T00:00:00 and end date 2022-06-08T00:00:00. I expect this event to take 3 full days, but on a calendar view, it shows as two only. In case add to end date 1-second event will take three days.

Here you can see a code example with this issue. https://stackblitz.com/edit/angular-k7xgds?file=src%2Fapp%2Fevents-utc.ts,src%2Fapp%2Fapp.component.ts,src%2Fapp%2Fapp.module.ts

I am using the kendo conversational ui to create the chat feature of my application.

I am mainly using this code from this article - https://www.telerik.com/kendo-angular-ui/components/conversational-ui

I am able to use the user icon and assign a image to it by accessing the user interface through my component file-

' readonly externalUser: User = {
id: 0,
name: 'Bot',
avatarUrl:
urlForImage,
}; '

The user icon is displayed automatically through the kendo chat decorator in the html file, hence I am unable to find a way to make any changes other to it. I need to find a way to make the user icon clickable so that I am able to show the user's profile popup with info like email id, address, contact number etc through it. Any help is appreciated.

<kendo-grid *ngIf="module"
    [kendoGridBinding]="module.permissions"
    kendoGridSelectBy="id"
    [pageSize]="10"
    [pageable]="true"
    [sortable]="true"
    (edit)="editPermissionHandler($event)"
    (cancel)="cancelPermissionHandler($event)"
    (save)="savePermissionHandler($event)"
    (add)="addPermissionHandler($event)"
    (remove)="removePermissionHandler($event)">
    <ng-template kendoGridToolbarTemplate>
        <button kendoGridAddCommand>Add new</button>
    </ng-template>
    <kendo-grid-column field="id" title="id" hidden="true"></kendo-grid-column>
    <kendo-grid-column field="code" title="Code" [width]="180"></kendo-grid-column>
    <kendo-grid-column field="description" title="Description"></kendo-grid-column>
    <kendo-grid-command-column title="" [width]="220">
        <ng-template kendoGridCellTemplate let-isNew="isNew">
            <button kendoGridEditCommand [primary]="true">Edit</button>
            <button kendoGridRemoveCommand>Remove</button>
            <button kendoGridSaveCommand [disabled]="formGroup?.invalid">
                {{ isNew ? "Add" : "Update" }}
            </button>
            <button kendoGridCancelCommand>
                {{ isNew ? "Discard changes" : "Cancel" }}
            </button>
        </ng-template>
    </kendo-grid-command-column>
</kendo-grid>

this is how I delete an item:

let indexToDel = this.module.permissions.findIndex(p => p.id == perm.id);
this.module.permissions.splice(indexToDel, 1)

//way to avoid that?
this.module.permissions = this.module.permissions.slice();

Can we avoid the last line to force the update?

Thanks

Hi

another question regarding the angular coffee example. I have made my own theme. I then added it to the drop-down in the header component link this (I also tried to change the default theme to ocean blue):

public themes: { href: string; text: string }[] = [
      {
         href: 'assets/kendo-theme-default/dist/default-ocean-blue.css',
         text: 'Kendo default (ocean blue)',
      },
      {
         href: 'assets/kendo-theme-bootstrap/dist/all.css',
         text: 'Bootstrap',
      },
      {
         href: 'assets/kendo-theme-material/dist/all.css',
         text: 'Material',
      },
      {
         href: 'assets/light-theme/dist/theme-light.css',
         text: 'My light theme',
      },
      {
         href: 'assets/dark-theme/dist/theme-dark.css',
         text: 'My dark theme',
      },
   ]

and I also updated my angular.json file to include copying the new assets:

 "assets": [
              "src/favicon.ico",
              "src/assets",
              {
                "glob": "**/*",
                "input": "node_modules/@progress/kendo-theme-default/dist",
                "output": "/assets/kendo-theme-default/dist"
              },
              {
                "glob": "**/*",
                "input": "node_modules/@progress/kendo-theme-bootstrap/dist",
                "output": "/assets/kendo-theme-bootstrap/dist"
              },
              {
                "glob": "**/*",
                "input": "node_modules/@progress/kendo-theme-material/dist",
                "output": "/assets/kendo-theme-material/dist"
              },
              {
                "glob": "**/*",
                "input": "src/assets/theme/dark",
                "output": "/assets/dark-theme/dist"
              },
              {
                "glob": "**/*",
                "input": "src/assets/theme/light",
                "output": "/assets/light-theme/dist"
              }
            ],

I thought this was pretty straightforward... I have double checked that the new files are in the assets folder but I am getting two errors:

1.  a **404 error** that the themes are not found...this is with my theme

2. a **The resource from ... was blocked due to MIME type (“text/html”) mismatch (X-Content-Type-Options: nosniff).** with the default-blue-theme.

Any idea what I am missing?

Thank you for any help given

Hi

How to apply number format in Kendo numeric steeper in dynamically (ex, lakhs to a million & a million to lakhs)

Thanks & Regards

A.Thamaraikannan

Hi,

I want to wrap header columns in grid , that based load data wrap format

its possible!

Thanks & Regards

A.Thamaraikannan