Hi ,
Thanks for your rsponse of my query .
As of now ,We are using many of the kendo grid features like sorting,filtering,searching,paging,show hide menus with Kendo grid .At present ,our team is using the Kendo trail version and plan to buying the kendo licene shortly.
I need a quick help for my below queries.

1) As of now ,I am trying to paste my records from one column to another column in kendo grid by using Angular.
At present ,this feature is available in JQuery but not in Angular.I am looking for the same feature from Angular 
with in the KendoGrid.Kindly share me the estimated arrival date if your team is working on it .
Find the reference below for the JQuery.

https://docs.telerik.com/kendo-ui/knowledge-base/grid-copy-columns-from-excel-paste-on-selected-columns

2) The other way is to use the Kendo UI widgets for jQuery together with Kendo UI components for Angular in Angular projects, include only components that have no counterpart in the Angular suite.If I follow this approach do i need to change the existing code otherwise it supports backward compatiablity with Angular.For your reference ,find the URL below for this approach.

https://www.telerik.com/kendo-angular-ui/components/framework/kendo-jquery/

3) Third approach is customise the paste event inside the grid by using context menu options .
Inwhich ,I can go use the cell click event on paste in to the grid.This case only one cell copy is possible .So,suggest me how to copy and paste multiple cell values over the Kendogrid.

Please share your answers and ETA as our team is in the development mode now .
Thanks and Regards,
Kamaraj.P

Hi,

I would like to customise a kendo grid column and reuse it across my application (basically avoiding to repeat some codes related to that column). The following is a very basic example. Let's say I want a customised string grid column. So, I create the component below:

Now, I use my component in the grid as follows, but neither that (first) column appears nor I get an error in the console!

Any help is appreciated.

Mojtaba

Hi All,

I would like to get support while implementing Control Chart + Range Slider. Please have a look to details below:

What I have so far:

- Kendo Chart Line with a Max/Min value in both axis is working fine.

- Range Slider is working fine.

What is not working:

- Not able control (min/max values) chart when user modify the range criteria on Range Slider.

What I need:

- Set Chart Zoom In & Out values, based on on Range Slider output.

Have attachment as a reference.

Thanks for your help.

Oskar

Hello Kendo UI Team,

The context menu for Kendo grid rows and columns is not working on the iPhone with the following configuration:
device: iPhone
Tested iOS version: 13.2.2 and 14.1
Browser: Safari

I'm referring to the context menu component that is used to render the context menu to the grid columns and rows. Here is the official page's demo. The context menu used in the demo isn't on the mentioned device.

I've used the same component that is used in the mentioned demo. 
File: grid-contex-menu.component.ts (available in the demo)
Component: GridContextMenuComponent

I have searched for any workaround for this but unfortunately could not find anything. It would be helpful if you can suggest any workaround.

Hi

I need to Add a point dynamically to a scatter chart without redraw / update the whole chart.

Something like a new point every few seconds - dynamically update.

Does anyone know a way to do it with Angular ?

Many thanks !!

In the telerik scheduler, how can we set the background color for a specific time range, for example 8AM-11AM for Monday and 10AM-3PM Tuesday etc.

I know we can override the time slot with the TimeSlotTemplateDirective, however, this does not have access to the current resource, it have access to all the resources, and on top of this is we cannot specific the time range? 

Is there any example can be provided to help achieving this? And how about if we are grouping by resources? Is it behavior possible as well?

Thanks

We have an application we are developing and are using the Kendo Dialog to wrap some of our screens. You can see it in action at https://tropicos.org. Many of our users are using Safari 13 on a Mac and have reported problems where the dialogs are clipping off the bottom when the view it overlays is smaller than the dialog itself. We are also experiencing problems where the dialog gets "tucked" under the header of the app cutting off the top of the dialog. One of the dialogs in question is the login dialog. I know we can use the service to control much of the features of the dialog however do not see why we should have to go back and refactor all of the screens that use dialogs to do so. They do behave correctly on chrome on the Mac and  I would expect the behavior that works on chrome to also work the same for Safari on the Mac machine. Is anyone else having the problem or is there an easier solution for this than refactoring all of our dialogs to use a service so we can control the position and what it container it appends to? 

I do not have access to a Mac to test all of my changes so it is very frustrating when the expected behavior would be the same across browsers.

Today I upgrading my project, using the command npx npm-check-updates -u -f /.*@progress.*/

My project compiles the theme from SCSS source files. 

After the upgrade, some SCSS variables are not defined. This is one of the errors I get from the terminal:

ERROR in ./src/assets/styles/styles.scss (./node_modules/css-loader/dist/cjs.js??ref--13-1!./node_modules/postcss-loader/src??embedded!./node_modules/resolve-url-loader??ref--13-3!./node_modules/sass-loader/dist/cjs.js??ref--13-4!./src/assets/styles/styles.scss)
Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
SassError: Undefined variable.
   ╷
25 │ $checkbox-hovered-border: $input-hovered-border !default;
   │                           ^^^^^^^^^^^^^^^^^^^^^
   ╵
  node_modules\@progress\kendo-theme-material\scss\checkbox\_variables.scss 25:27  @import
  node_modules\@progress\kendo-theme-material\scss\checkbox\_index.scss 9:9        @import
  node_modules\@progress\kendo-theme-material\scss\adaptive\_index.scss 7:9        @import
  node_modules\@progress\kendo-theme-material\scss\grid\_index.scss 7:9            @import
  src\assets\styles\_kendo-components.scss 12:9                                    @import
  src\assets\styles\styles.scss 5:9                                                root stylesheet

=================================================================================

I was able to recreate the issue by

1. create a new angular project
2. install the inputs package:  ng add @progress/kendo-angular-inputs
3. install material theme: npm install --save @progress/kendo-theme-material
4. remove the following styles in angular.json
       "input": "node_modules/@progress/kendo-theme-default/dist/all.css"
5. add the following import for inputs in styles.scss
       @import '~@progress/kendo-theme-default/scss/input/_index.scss';
6. build the project: ng build

Error in the terminal: 
---------------------------

ERROR in ./src/styles.scss (./node_modules/css-loader/dist/cjs.js??ref--13-1!./node_modules/postcss-loader/src??embedded!./node_modules/resolve-url-loader??ref--13-3!./node_modules/sass-loader/dist/cjs.js??ref--13-4!./src/styles.scss)
Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
SassError: Undefined variable.
   ╷
42 │ $input-border: $button-border !default;
   │                ^^^^^^^^^^^^^^
   ╵
  node_modules\@progress\kendo-theme-default\scss\input\_variables.scss 42:16  @import
  node_modules\@progress\kendo-theme-default\scss\input\_index.scss 10:9       @import
  src\styles.scss 2:9                                                          root stylesheet

This is my package.json

  "dependencies": {
    "@angular/animations": "~10.1.1",
    "@angular/common": "~10.1.1",
    "@angular/compiler": "~10.1.1",
    "@angular/core": "~10.1.1",
    "@angular/forms": "~10.1.1",
    "@angular/localize": "~10.1.1",
    "@angular/platform-browser": "~10.1.1",
    "@angular/platform-browser-dynamic": "~10.1.1",
    "@angular/router": "~10.1.1",
    "@progress/kendo-angular-common": "^1.0.0",
    "@progress/kendo-angular-inputs": "^6.7.2",
    "@progress/kendo-angular-intl": "^2.0.0",
    "@progress/kendo-angular-l10n": "^2.0.0",
    "@progress/kendo-angular-popup": "^3.0.0",
    "@progress/kendo-drawing": "^1.5.12",
    "@progress/kendo-theme-default": "latest",
    "@progress/kendo-theme-material": "^3.21.0",
    "rxjs": "~6.6.0",
    "tslib": "^2.0.0",
    "zone.js": "~0.10.2"
  },

Are there more files or dependencies required? What else do I need to import in the styles. I prefer not to import all the styles since we are only using a selection of the components.

We have a parent and child grid setup within our app.  Everything works fine except that the headers in the child grid are somehow inheriting CSS that underline the headers.

Here is the code in the parent:

    <kendo-grid-column field="ReportID">
      <ng-template kendoGridCellTemplate let-dataItem>
        <div class="k-icon k-i-plus-circle" style="color: limegreen; cursor:pointer;" title="Add" (click)="addToFavorite(dataItem.ReportAssociationID)"></div>
      </ng-template>
    </kendo-grid-column>
    <ng-template kendoGridDetailTemplate let-dataItem>
      <reportDocumentGrid>CHILD GRID IS IN HERE</reportDocumentGrid>
    </ng-template>

For some reason the headers in the child grid are getting the following style applied:

.k-grid tbody tr td:not(.k-hierarchy-cell) a {
text-decoration: underline;
}

Really stuck here, thanks in advance!