Hi,

Is there any example about Kendo grid grouping with ODdata ?

I couldn't find example on documentations.

Thanks.

Hello, 

I am trying to style and size the sort arrow icon that Kendo provides in the react data grid. I have attached a picture of the specific arrow I am talking about. I have managed to change the color of the sort icon with the CSS below, howerver I have not figured out how to change the sizing of the arrow here. If possible, I would also like to adjust the icon shape (make it thicker and shorter), and maybe use a custom icon for it if possible. Can you advise me on some possible solutions I could implement? Thank you. 

I have added a custom column menu to my kendo grid. It has a dropdown list element, where users can choose an option and the grid data is filtered. This all works successfully.

I have one issue. When the user clicks on the Filter or Clear Button, the column menu does not disappear. Clicking outside the column menu does not hide the column menu.

I have to click on the column menu again to focus it, then when I click outside the column menu, it disappears.

I cannot get access to the div 'k-grid-columnmenu-popup', as this is controlled by kendo and does not appear in my column menu component.

Has anyone come up against this problem and solved it?

"Currently, I am using a drawer, but the issue is that the content inside the drawer is not responsive. I am attempting to create a wrapper for the content within the page, but I'm encountering difficulties with the CSS not functioning as expected. Could you kindly suggest an appropriate method for designing a responsive page?

========================================================================================

 "I am currently using a wrapper for sharing my code, for example."<wrapper direction="column">

<row>

<div> my page code </div>

<row>

</wrapper>

==============================================================================================

import React, { ReactNode } from "react";

Hi,

I am planning to use React Spreadsheet for one of my projects. Unfortunately, I am unable to bind remote data to spreadsheet. All examples I could find are using static files to set the spreadsheet structure and on my own tests I failed to re-render spreadsheet component when remote data is bound.  Could you please provide an example in that matter?

Here is my code:

  const defaultStructure = {
      sheets: [
        {
          name: t('Summary'),
          mergedCells: ['B1:C1'],
          rows: [
            {
              height: 25,
              cells: [
                {
                  value: t('Please enter customer name'),
                  textAlign: 'center',
                  index: 0,
                },
                {
                  background: 'rgb(167,214,255)',
                  textAlign: 'center',
                  index: 1,
                },
              ],
            },
            {
              height: 50,
              cells: [
                {
                  value: t('Please enter minimum gross salary of your region'),
                  textAlign: 'center',
                  index: 0,
                },
                {
                  value: '',
                  background: 'rgb(167,214,255)',
                  textAlign: 'center',
                  index: 1,
                },
              ],
            },
          ],
          columns: [
            {
              width: 400,
            },
            {
              width: 200,
            },
            {
              width: 400,
            },
          ],
        },
        {
          name: t('Parametric Data Entry'),
          rows: [],
          columns: [
            {
              width: 100,
            },
            {
              width: 100,
            },
          ],
        },
      ],
    }

const [structure, setStructure] = useState(defaultStructure)

    useEffect(() => {
      if (!store?.parameters.isLoaded) return

      const p = store?.parameters.parameters
      const s = defaultStructure.sheets[0]

      defaultStructure.sheets[0].rows[1].cells[1].value = p?.grossWage

      setStructure({ ...defaultStructure })
    }, [store?.parameters.isLoaded])

   
    return (
      <>
          <div className="p-3">
            <div className="card-body">
              <Spreadsheet
                style={{
                  width: '100%',
                  height: 680,
                }}
                defaultProps={structure}
              />
            </div>
          </div>
      </>
    )
  })

Regards,

Hi,

    I try to implement drag drop row and selection row in datagrid, So I try your demo code https://www.telerik.com/kendo-react-ui/components/grid/rows/row-reordering/.

but when I just add 'selectable' property to the demo code, The drag-drop behavior looks strange, after that, I add all selection code in demo https://www.telerik.com/kendo-react-ui/components/grid/selection/, It is still can not drag drop normally

is it a bug? or currently not support both drag-drop and selection row?