Last Updated: 21 Jul 2020 10:24 by ADMIN
Created by: FIIG Securities
Comments: 3
Type: Bug Report

There seems to be bug in the React Grid around date formatting inconsistencies:

Current behavior
When entering a date format of {0:dd/MM/yyyy} for a ColumnData prop, when in edit mode a calendar picker shows the date format as US date of MM/dd/yyyy.Expected behavior
The date should show as dd/MM/yyyy per the requested date format.Minimal reproduction of the problem with instructions
Create a Kendo grid with one column with following ColumnData:
const settlementDate: ColumnData = {
field: 'settlementDate',
title: 'Setlement Date',
format: '{0:dd/MM/yyyy}',
filterable: true,
filter: 'date',
editor: 'date'
Note that the date is displayed as MM/dd/yyyy
Change the format to "dd/MM/yyyy"
Note that when in view mode the date is displayed as "dd/MM/yyyy".
What is the motivation or use case for changing the behavior?
Currently I have to create a custom date cell for every instance of using a date field in my grid which is less than ideal.Environment
Package versions:
@progress/kendo-base-component-react-wrapper@2019.2.606 deduped
@progress/kendo-ui@2019.3.1113Browser:Chrome (desktop) version 78.0.3904.108
Platform: Windows

Other information:
It appears that there is an incompatibility as to what a text display field requires as opposed to what a date picker requires. For text display it requires a format of '{0:dd/MM/yyyy}' whereas the datepicker requires a format of "dd/MM/yyyy".

Last Updated: 03 Jul 2020 06:00 by ADMIN

I am trying to lock first column in Grid, when I used the instructions in Kendo React documentation I tried the same but as you see in screenshots it's not working.

Last Updated: 24 Dec 2019 08:07 by ADMIN

In the case of multiple columns headers, the column width of the KendoReact  TreeList  is invalid



const columns = [
   { field: 'name', title: 'Name', width: 300, expandable: true }
    { title: 'Employee Details', width: 600, children: [
        { field: 'position', title: 'Position', width: 500 },
        { field: 'fullTime', title: 'Full Time', width: 100 }
    ] }
Last Updated: 07 Aug 2019 06:27 by ADMIN

The tooltip display position of KendoReact Chart  is incorrect

See the code.thank you




Last Updated: 26 Jun 2019 14:05 by ADMIN
Created by: Nathaniel
Comments: 1
Type: Bug Report

I am using the ComboBox component in IE11.  When the control has a value, the clear button covers the select arrow at the right of the control.  This occurs because IE11 does not allow nested calc() calls in the CSS width property, e.g. 

.k-dropdown-wrap .k-clear-value {
    right: calc(calc( 0.75rem + 17px) + 6.5px);

Removing the inner calc() works well enough:

.k-dropdown-wrap .k-clear-value {
    right: calc(( 0.75rem + 17px) + 6.5px);

Unfortunately, this rule seems to originate from a CSS function call to which I do not have access.  Is it possible to remove the inner calc()?

Last Updated: 26 Jun 2019 14:04 by ADMIN
Created by: Nathaniel
Comments: 6
Type: Bug Report

When rendering an AutoComplete, I get the following warning:

Warning: Failed prop type: Invalid prop `children` supplied to `Popup`.
    in Popup (created by ListContainer)
    in ListContainer (created by AutoComplete)
    in span (created by AutoComplete)
    in AutoComplete

I have tried this in the simple case below:

        validationMessage="Location Required." />,
Last Updated: 19 Feb 2019 12:19 by ADMIN

If you create a react grid without any GridColumn components and then add those components later, the added columns do not show and the grid is empty.  It appears, after a quick look that the columns have a width of 0 pixels.  They exist in the html, just not displayed.


See as an example of the problem.  This example starts with a populated grid.  You can add columns and data using the buttons above the grid.  This works fine.  If you then "Reset" the grid with the button, which removes all data, any attempt to add columns and data will show a blank grid.




Last Updated: 14 Jan 2019 06:31 by ADMIN

We are evaluating the React Grid component for our application and need to be able to have rows that span all columns.  To do this, I have created a rowRender function that, for some rows, will render a single <td> element with the colspan set to 100%.  The row renders fine, but the other rows, that have multiple <td> elements do not all render correctly.  For my test application, they will render with a width of 8 pxs.  On resize of a column, they will almost render correctly.

Here are some pictures of the issue in our test code.

I have created a sandbox that sort of reproduces the bug.

If you select the "Show Full Row", the row with Id 999 will convert to a single <td> element with colspan='100%'.  You will notice how after doing so, the last three columns collapse to a small number of pixels.