Telerik Forums
KendoReact Forum
1 answer
169 views

I have added the Globalization and IntlProvider to the Grid and it works but for the Column options there is one entry missing in the documentation and that's the "Columns" entry (see screenshot). Is there a possibility to add a translation for this item?

 

Konstantin Dikov
Telerik team
 answered on 19 May 2022
1 answer
110 views

Hi!
I have been using validation properties (required, max length, validationMessage etc) for the forms.

Is there any way to have the same functionality for Grid component to have validations in the  Columns?

As they are free inputs for the users too, 
would be nice if you can provide some examples to know how to handle them.

Thanks for your time,
Rebeca.

Filip
Telerik team
 answered on 19 May 2022
1 answer
323 views

Hi, I'm trying to combine many functionality on kendo react data grid.

I want to allow multiselect, custom cell, custom menu filter, contextual menu and double click managing.

I tried like in following project:

https://stackblitz.com/edit/react-tcu25m

 

I started from following examples:

https://stackblitz.com/edit/react-7mz85d (double click managing)

https://stackblitz.com/edit/react-fx9xkl (multiselect)

But, combining the 2 way the double click fires only sometimes. Maybe because the click was consumed by selection?

How can I get all my needs?

Konstantin Dikov
Telerik team
 answered on 18 May 2022
1 answer
102 views

Hello,

 

I am trying to localize my entire application but I cannot get this example working; https://www.telerik.com/kendo-react-ui/components/intl/l10n/reacting-to-language-changes/

My code is below.

import { Message } from '../../common/Message';

loadMessages(messages["es"], "es");

const DetailComponent = (props: any) => {

    const locales: LocaleInterface[] = [
        {
          language: "en-US",
          locale: "en",
        },
        {
          language: "es-ES",
          locale: "es",
        },
      ];
    const [currentLocale, setCurrentLocale] = React.useState<LocaleInterface>(
        locales[0]
    );
const defaultMessages = {
  [yesterdaysMessageKey]: "Yesterday was a good day!",
  [todaysMessages]: "Today is a good day as well!",
  [tomorrowsMessageKey]: "Tomorrow will be even better!",

};

 

return (

<LocalizationProvider language={currentLocale.language}>
<IntlProvider locale={currentLocale.locale}>
<p>
 <strong> <Message messageKey={yesterdaysMessageKey} defaultMessage={defaultMessages[yesterdaysMessageKey]}/>:</strong> {dataItem.nickname}

</p>

</IntlProvider>
</LocalizationProvider>
  );

};

 

import * as React from "react";
import { useLocalization } from "@progress/kendo-react-intl";
interface MessageProps {
  messageKey: string;
  defaultMessage: string;
}
export const Message = (props: MessageProps) => {
  const localization = useLocalization();
  return (
    <span style={{ display: "block" }}>
      {localization.toLanguageString(props.messageKey, props.defaultMessage)}
    </span>
  );

};

 

export interface LocaleInterface {
    language: string;
    locale: string;
  }
 
Filip
Telerik team
 answered on 17 May 2022
1 answer
126 views

Hi.

I have a Data Grid which includes two TimeInput fields, onTime and offTime and I want to make sure that when the user hits the update button of the row that offTime is always bigger than onTime. My problem is not the calculation, it's more like: What is the best way to check the values of the 2 fields and how do I set the focus on the offTime field when it is lower than the onTime? It would also be possible to not check it on the update button click but when the field is blurred or so. Not sure how to handle this best.

I have used one of your Grid-Examples and manipulated it a bit so that the 2 fields are already in there but there are of course a couple of things missing like a form for example. Maybe you can direct me at least in the right direction how to handle this best.

https://stackblitz.com/edit/react-nq2pkf?file=index.js

Thanks!

Greetings,

Bernd

Konstantin Dikov
Telerik team
 answered on 17 May 2022
0 answers
107 views

I have had a weird issue with multi-page PDFs. It is pushing content to a second page when there is plenty of room left on the page for the content to be on the first page. Please see below. I have tried adding the keepTogether CSS class, but it is still moving to next page. Has anyone else experienced this issue. Any help would be appreciated.

 

 

 

Stephen
Top achievements
Rank 1
 asked on 16 May 2022
1 answer
155 views

Hi.

In the Month-View of the Scheduler I only would like to render the events that are allDay events. In all other views (day, week, etc) everything should show. Currently I solve this using conditional rendering but I wonder if there would be a more efficient way to achieve this. So what I do right now is that I have a custom EditItem for the MonthView and in the EditItem I do this:

    return (
        <>
            {dataItem.isAllDay && (
                    <SchedulerEditItem ...

I wonder if I somehow do this in a more efficient way by not even using the MonthView for the non all day events or so. Any ideas?

Konstantin Dikov
Telerik team
 answered on 13 May 2022
1 answer
104 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

Konstantin Dikov
Telerik team
 answered on 12 May 2022
1 answer
56 views

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.

 

 

 

 

Filip
Telerik team
 answered on 11 May 2022
1 answer
105 views
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.
Konstantin Dikov
Telerik team
 answered on 11 May 2022
Narrow your results
Selected tags
Tags
+? more
Top users last month
Bohdan
Top achievements
Rank 3
Iron
Iron
Iron
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
Elliot
Top achievements
Rank 1
Iron
Iron
Iron
Sunil
Top achievements
Rank 1
Cynthia
Top achievements
Rank 1
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Bohdan
Top achievements
Rank 3
Iron
Iron
Iron
Rob
Top achievements
Rank 3
Bronze
Bronze
Iron
Elliot
Top achievements
Rank 1
Iron
Iron
Iron
Sunil
Top achievements
Rank 1
Cynthia
Top achievements
Rank 1
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?