Hello,

We are using kendo-react-inputs 3.17.0

I've created minimal reproduction example from problem that we have with Checkbox component.

If, we at the very first step click on the checkbox then properly true is displayed. Checkbox also says true.

Then, we click button that changes Parent state outside from kendo component. Now, it looks like checkbox is not updated.

Checkbox still says it's true, but we can see that text value says false.

Example is here:

https://codesandbox.io/s/serene-jackson-lrc2i?file=/src/Parent.tsx

Thanks in advance for explanation!

Best regards,

Arek

1) Use this StackBlitz application: https://react-scwx3i.stackblitz.io - This is based on Telerik's own DatePicker React example.

2) Highlight the AM/PM section.

3) Try to change the AM/PM section via typing. It doesn't change. Note that other fields in the date/time picker are responsive to keyboard input.

Expectation is that the AM/PM section should respect at least "A" and "P" inputs.

1) Use this StackBlitz application: https://react-scwx3i.stackblitz.io - This is based on Telerik's own DatePicker React example.

2) Highlight the AM/PM section.

3) Press the up arrow key to go from "AM" -> "PM" -> "AM" - note that for each "PM" to "AM" change, the Day value increments

4) Press the down arrow key to go from "AM" -> "PM" -> "AM" - note that for each "AM" to "PM" change, the Day value decrements.

My expectation is that changing AM/PM values should not change any other sections of the Date/Time value.

I am a beginner with js and react and i try in my environment to recreate a chart.

I have everything I need (package, react, etc) but I can't make it work the example code.

I know that the problem becomes from the last part of code (ReactDOM.render) but i don't know with certainty what is it.

What i doing wrong?

Hi, 

Is there an example somewhere using KendoReact notifications in a more dynamic way instead of (for the lack of a better term) one-by-one?

What Im looking for is a way to manage multiple notifications/toasts like:
 - https://jossmac.github.io/react-toast-notifications/
 - https://www.npmjs.com/package/react-toastify

Currently the examples I've found are just managing Notifications in the app state. The current functionality is limited.

Please advise.

Thanks,
Grant

Hi,

On your example : https://www.telerik.com/kendo-react-ui/components/popup/aligning-positioning/#toc-positioning

If I choose Anchor align point vertical middle, the top right popup corner is in the anchor, why ?

Regards,
Joccd

https://stackblitz.com/edit/react-s8ugrr-dvxqcf?file=app/main.jsx

When you click in the TextArea in the above StackBlitz, React throws a warning in the console:

It appears that when we disable the TextArea, it does not match the styling of the other input components. My initial thought is that this is because of two things:

1. The <span class="k-textarea"> needs a k-state-disabled applied.
2. The themes need something like the following in the .scss:

I could be way off base here, of course.  Here's a StackBlitz showing the issue with a current, ugly, workaround: https://stackblitz.com/edit/react-s8ugrr-57r5pk?file=app/main.jsx

hi,

I am using KendoReact grid and paging and have a grid something like below. we have some filters outside the grid that are applied on grid. And we are using react-redux to preserve the filters state so that grid can be recreated again as per the filters selected on redirection.

can we also add the pagesize to redux so that its value can also be preserved and the same number of records remain selected or shown on redirection.

I am not sure if there is any event that we can use for this purpose. any help will be appreciated.

<Grid
          sortable
          filterable
          resizable
          reorderable
          pageable={{
            buttonCount: 4,
            pageSizes: [10, 20, 50, 100, formsList.length],
          }}
          data={process(formsList, dataState)}
          {...dataState}
          onDataStateChange={(e) => {
            setDataState(e.data);
          }}
          cellRender={customCellRender}
          headerCellRender={customHeaderRender}
        >
          {user && isAuthenticated && user.isAdmin && (
            <GridToolbar>{getFormFilters()}</GridToolbar>
          )}
          <GridColumn field="formNumber" title="Number" />
          <GridColumn width="300px" field="formTitle" title="Form Title" />
          <GridColumn
            width="200px"
            field="formattedRevisionDate"
            title="Revision Date"
            headerClassName="text-wrap"
            filter={"date"}
            format="{0:M/d/yyyy}"
          />
          <GridColumn field="formStatus" title="Status" />
          <GridColumn field="notes" title="Notes" />
          <GridColumn field="responsibleOffice" title="Office" width="175px" />
          <GridColumn
            field="procedureNumber"
            title="Procedure"
            cell={procedureCell}
          />
          <GridColumn
            title="Available Formats"
            field="attachmentTypes"
            cell={attachmentsCell}
            headerClassName="text-wrap"
          />
          <GridColumn
            filterable={false}
            sortable={false}
            title="Actions"
            cell={actionsCell}
          />
        </Grid>