Questions on KendoReact Forum

1 answer

100 views

I want to update tree list package to the latest currently it is on the 4.3.0 version ("@progress/kendo-react-treelist": "^4.3.0",)

When I run the npm update command it gets updated to 4.14.1 but not to 5.2.0. Actually, I want to access the selectable property of the Tree list so that I can enable the selection of cells by dragging onto them this feature does not work for me on the 4.3.0 version.

Manay thanks

TreeList

answered on 12 May 2022

1 answer

47 views

ChartCategoryAxisItem type attribute with value "date" is giving "Something went wrong r is undefined" error

I am using kendo react UI Chart component for column chart. i have used

ChartCategoryAxisItem in which i am using type as date but this is giving me an error "Something went wrong r is undefined".
This error is coming on firefox and edge not on chrome. 
CCode: 
 
 <ChartCategoryAxis>
        <ChartCategoryAxisItem
          type="date"
          baseUnit="days"
          labels={{
            dateFormats: {
              days:"MM-dd",
            },
            rotation: "auto",
          }}
        />
      </ChartCategoryAxis>



Any help is appreciated.
 
 
 

Charts

answered on 11 May 2022

1 answer

92 views

MultiSelectTree - Disable Item Checkbox

Is it possible to disable the checkbox if an item or subItem should be disabled? I know we have the item prop to render the label text and I am able to indicate a disabled state on the text but is there anyway to target the checkbox? I can prevent it from being selected but I would like to disable the checkbox. Thank you.

MultiSelect

answered on 11 May 2022

1 answer

97 views

Data grid editing including cell selection

Hi.

I have created a grid with editing as described in your example here:

https://www.telerik.com/kendo-react-ui/components/grid/editing/editing-custom/

The issue I have now is that I also have row selection enabled for the grid with a checkbox as described in this example:

https://www.telerik.com/kendo-react-ui/components/grid/selection/

My issue is now, that when the edit dialog opens for any field, and I click in a field to edit the value, the checkbox for the row selection gets activated. So the question is: How can avoid to activate the row selection when a row is in Edit mode?

Grid

answered on 11 May 2022

1 answer

169 views

Shift focus to down cell on Enter key press on tree list

I have a requirement where when I am editing in the cell and hit enter the cell focus should be shifted to the down cell just like the MS Excel does.

Does Tree list support it?

Many thanks

TreeList

answered on 11 May 2022

1 answer

253 views

is there a way to disable the checkbox in the datagrid component?

Hi,

I wanted to disable the checkbox based on it's value. Is there a proper way of disabling it?

I'm using the sample code on this page https://www.telerik.com/kendo-react-ui/components/grid/selection/#toc-customizing-the-selection

Thanks!

Checkbox

Grid

answered on 08 May 2022

1 answer

124 views

How to shift focus from one cell to another in tree list?

I have a requirement where I want to shift focus from one cell to another when a user hits the tab button.

Is there a built-in functionality in the Tree list OR any customization that needs to be done?

Many thanks

TreeList

answered on 05 May 2022

1 answer

99 views

Kendo react scheduler: timeline view separator between dates

Hello

Is it possible somehow to make a border between dates a bit bigger?

Because for not it is difficult to distinguish different dates in the timeline view

Scheduler

answered on 04 May 2022

0 answers

231 views

Kendo-react-scheduler issue: event is not visible if start date outside of working hours range

I found an issue:

if an event is not visible if start date outside of working hours range and end date is outside of working hours:

the code was taken from scheduler demo:

const App = () => {
return (
<Scheduler data={sampleData} defaultDate={displayDate}>
<WeekView />
</Scheduler>
);
};

const baseData = [
{
TaskID: 119,
OwnerID: 3,
Title: 'Helpdesk weekly meeting',
Description: '',
StartTimezone: null,
Start: '2013-06-05T15:00:00.000Z',
End: '2013-06-06T14:00:00.000Z',
EndTimezone: null,
RecurrenceRule: 'FREQ=WEEKLY;BYDAY=WE',
RecurrenceID: null,
RecurrenceException: null,
isAllDay: false,
},
];
export const customModelFields = {
id: 'TaskID',
title: 'Title',
description: 'Description',
start: 'Start',
end: 'End',
recurrenceRule: 'RecurrenceRule',
recurrenceId: 'RecurrenceID',
recurrenceExceptions: 'RecurrenceException',
};

https://react-yxcnuz.stackblitz.io/

As you can see the start of event is outside of working hours and end date is outside of working hours for next date.

In case I see only working hours I do not see event at all

In case I enabled all day hours I do see event

Scheduler

asked on 04 May 2022

2 answers

763 views

Kendo-react-popup uses inline CSS and violates Content Security Policy

In our react project we have used @progress/kendo-react-grid module and set content security policy as style-src 'self'.
Kendo-react-grid has dependency on Kendo-react-popup and that package is using inline style which violates content security policy. What is the best solution to overcome this issue or is there any version available for the same package without inline style.

Have attached screen shot of that function and We are getting below console error:

util.js:97 Refused to apply inline style because it violates the following Content Security Policy directive: "style-src 'self'". Either the 'unsafe-inline' keyword, a hash ('sha256-Y+wsDh+eE='), or a nonce ('nonce-...') is required to enable inline execution.

hasRelativeStackingContext @ util.js:97
../../node_modules/@progress/kendo-react-dateinputs/node_modules/@progress/kendo-react-popup/dist/es/util.js @ util.js:106
__webpack_require__ @ bootstrap:19
../../node_modules/@progress/kendo-react-dateinputs/node_modules/@progress/kendo-react-popup/dist/es/Popup.js @ Popup.js:1
__webpack_require__ @ bootstrap:19
../../node_modules/@progress/kendo-react-dateinputs/node_modules/@progress/kendo-react-popup/dist/es/main.js @ main.js:1
__webpack_require__ @ bootstrap:19
../../node_modules/@progress/kendo-react-dateinputs/dist/es/datepicker/DatePicker.js @ DatePicker.js:1
__webpack_require__ @ bootstrap:19
../../node_modules/@progress/kendo-react-dateinputs/dist/es/main.js @ main.js:1
__webpack_require__ @ bootstrap:19
../../node_modules/@progress/kendo-react-data-tools/dist/es/filteringCells/DateFilter.js @ DateFilter.js:1
__webpack_require__ @ bootstrap:19
../../node_modules/@progress/kendo-react-data-tools/dist/es/filteringCells/index.js @ index.js:1
__webpack_require__ @ bootstrap:19
../../node_modules/@progress/kendo-react-data-tools/dist/es/main.js @ main.js:1
__webpack_require__ @ bootstrap:19
../../node_modules/@progress/kendo-react-grid/dist/es/Grid.js @ Grid.js:1
__webpack_require__ @ bootstrap:19
../../node_modules/@progress/kendo-react-grid/dist/es/main.js

General Discussions

answered on 04 May 2022