Questions on KendoReact Forum

1 answer

196 views

Disabling Conversational UI scroll animation

Is there an easy way to disable the Conversational UI scroll to bottom animation?

Animation

Conversational UI

answered on 22 Jun 2021

1 answer

103 views

Scheduler - After-Hours Appointment Bug?

Here's another one for you. I didn't see any similar bugs listed in GitHub. Did I find a bug?

Repro Steps:

(Updated: Important first step.) Setup:

Run these steps on a laptop running Windows 10.
Set the time zone to CDT aka "Central Daylight Time" aka "America/Chicago".
When testing in Firefox, you must close and re-start the browser after changing time zone.
In Chrome, restarting the browser shouldn't be necessary.
In either browser, open the developer console, click on Console to open a JavaScript console, type "new Date()", and push Enter. Confirm that the result is displayed in Central time (ex: "Mon Jun 21 2021 14:19:38 GMT-0500 (Central Daylight Time)").
This bug is reproducible when the browser is in CDT, and this bug is NOT reproducible when the browser is in MSK.

Run the "KendoReact Scheduler Demo Preview" demo from https://www.telerik.com/kendo-react-ui/components/scheduler/#toc-kendoreact-scheduler-demo-preview . Running it directly from the Telerik site is fine; StackBlitz is not necessary.

Note that the Scheduler starts out in "business hours" mode, with a "Show full day" button visible at the bottom.

Double-click an empty slot to add a new appointment.

Enter a Start Time outside business hours such as 6 PM.

Enter a title, description, end time as necessary and push Save.

The new appointment is not visible. This is expected, as it's outside business hours.

Now push "Show full day".

Result:

The new appointment is NOT visible.

But push the ">" button on the top left, to the right of the "today" button. Then push the "<" button. (This moves forward a week, then moves back.) The appointment is now visible.

Expected:

The new appointment should be visible immediately upon pushing "Show full day".

Scheduler

updated question on 21 Jun 2021

5 answers

157 views

VS2019 Pro + .Net Core 5.0 App + Simple DataGrid no databinding = invalid-hook-call

Hello,

I can't try ReactKendo DataGrid component for my project (Tests before buy)

With others components like PanelBar, Calendar, etc.. :

I tried this code directly on my index.js

import React from 'react';
import ReactDOM from 'react-dom'
  
import { Grid, GridColumn } from "@progress/kendo-react-grid";

ReactDOM.render(
  <div>
        <Grid style={{ height: "400px" }}>
            <GridColumn field="ProductID" title="ID" width="40px" />
            <GridColumn field="ProductName" title="Name" width="250px" />
            <GridColumn field="Category.CategoryName" title="CategoryName" />
            <GridColumn field="UnitPrice" title="Price" />
            <GridColumn field="UnitsInStock" title="In stock" />
        </Grid>
  </div>,
  document.getElementById('my-app'));

my index.html :

<!DOCTYPE html>
<html lang="fr">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="theme-color" content="#000000">

    <base href="%PUBLIC_URL%/" />

    <link rel="manifest" href="%PUBLIC_URL%/manifest.json">
    <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">

    <script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>
    <script src="https://unpkg.com/react@16/umd/react.production.min.js" crossorigin></script>
    <script src="https://unpkg.com/react-dom@16/umd/react-dom.production.min.js" crossorigin></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/prop-types/15.7.2/prop-types.min.js"></script>
    <script src="https://unpkg.com/@progress/kendo-date-math@dev/dist/cdn/js/kendo-date-math.js"></script>
    <script src="https://unpkg.com/@progress/kendo-drawing@latest/dist/cdn/js/kendo-drawing.js"></script>
    <script src="https://unpkg.com/@progress/kendo-react-intl@latest/dist/cdn/js/kendo-react-intl.js"></script>
    <script src="https://unpkg.com/@progress/kendo-react-all@latest/dist/cdn/js/kendo-react-all.js"></script>

    <title>MyTest</title>
</head>
<body>
    <div id="my-app">

    </div>
</body>

</html>

For compilation on VS2019 Pro 16.9.3 with node 14.17 (npm 6.14.13) :

I activated trial version of KendoReact for 30 days today via npx command line !

On Chrome and on Firefox browser, I have this error message :

my package.json :

My Packages Nuget list :

Very simple strangely !!!

And I have the same issue on VS Code last version too !!!!

Do you can help me to resolve this issue please ?

I need test this component before my order of ReactKendo !!!!

Thank you

Drawing

Grid

Licensing

answered on 21 Jun 2021

3 answers

211 views

Grid dynamically hiding columns collapsing grid view

Hi,

We are using kendo grid with n number of columns, each column has defined width. When user dynamically hiding the column kendo grid view collapsing [column width & border not aligned with row contents].

I have attached sample image.

Thanks,

Grid

Styling

answered on 18 Jun 2021

1 answer

170 views

GridColumnMenuCheckboxFilter - Filter button aligned incorrectly

Hi,

In kendo react grid we were using both GridColumnMenuFilter and GridColumnMenuCheckboxFilter, the 'Filter' button aligned differently in both the components.

GridColumnMenuFilter - Filter button is aligned right side & GridColumnMenuCheckboxFilter - Filter button is aligned left side

I have attached snapshots, can you please add

Thanks,

answered on 17 Jun 2021

0 answers

116 views

GridColumnMenuCheckboxFilter - Checkbox is not enabled

Hi Stefan,

We are selected all the options in GridColumnMenuCheckboxFilter and sometimes checkbox is not checked even though it selectd.

Thanks.

asked on 17 Jun 2021

1 answer

168 views

Whether KendoReact compatible with Streamlit?

https://docs.streamlit.io/en/stable/develop_streamlit_components.html

https://streamlit.io/

https://github.com/streamlit/component-template

Is there any possibility using KendoReact with this environment?

General Discussions

answered on 17 Jun 2021

1 answer

441 views

How to Rotate labels React Chart kendo

Hi

I can not find any resource for rotate labels

please help me

Charts

Labels

Styling

answered on 16 Jun 2021

1 answer

129 views

Scheduler - ZonedDate/Date Bug?

Did I find a bug?

Repro Steps:

Run the "KendoReact Scheduler Demo Preview" demo from https://www.telerik.com/kendo-react-ui/components/scheduler/#toc-kendoreact-scheduler-demo-preview in StackBlitz (to gain easy access to the JavaScript console).

Run the app in a new window (to gain easier access to the JavaScript console).

Open your browser's developer tools to view the JavaScript console.

In the top left corner, to the right of the "today", "<", and ">" buttons, click the date to open the calendar.

Select a different day from the calendar.

Result:

Calendar closes, and Scheduler navigates to the new day.

Expected:

No error messages.

Actual:

In FireFox, I see this:

Warning: Failed prop type: Invalid prop `date` of type `e` supplied to `KendoReactScheduler`, expected instance of `Date`. exports.Scheduler<@https://pwbqpa--run.stackblitz.io/turbo_modules/@progress/kendo-react-scheduler@4.6.0/dist/npm/Scheduler.js:51:20 App@https://pwbqpa--run.stackblitz.io/~/app/main.jsx:53:9

Notes:

It seems the Scheduler sends a ZonedDate when selecting a date by clicking on a day. It sends a Date in other instances. Scheduler.d.ts states SchedulerDateChangeEvent.value is a Date, not a Date | ZonedDate.

Scheduler