Hi,

I am working on a grid where i am enabled editable columns, all works fine as expected. my question how to disable only few rows in a grid to not editable

for example, i have 5 rows in grid and only 3 rows can be editable not others. i have column in a row that says can be editable or now

any help will be appreciated

Hi Team,

I am working on the grid with checkbox using the sample provided here https://www.telerik.com/kendo-react-ui/components/grid/selection/

its working as stated in the example, but one question, is there way to avoid row checkbox to not checked when we click on any other column in the grid(other than checkbox column).

for example, in below screen i am clicking on product name(2nd) column and entire row is selected and checkbox is checked. i don't want checkbox to be checked when i click on other columns.

Hello, i am using KendoReact Grid component, for one column i use custom component for cell, for some reason OnRowDoubleClick event doesn't fire when i double click on this cell, fot other cells double click is working fine, what am i doing wrong? is there a way to make it work?

event doesn't fire when you click on span element(blue on screen), but when you click on cell padding(green on screen) it does fire

it looks like i need to pass the event on span element, but i dont know which one since only event that comes through props is onChange

I want to turn on the left Y-axis title, similar to what is in the link below, but for a Bubble chart. 

https://stackblitz.com/edit/react-xtyhbu?file=app/main.js

Thanks

Hi. So I'm building an application where different data would be made available to the user at various times which would cause the spreadsheet they are looking at to update. New columns, rows, data, everything.

My understanding is that because this is a jQuery Kendo Spreadsheet, it's not going to act in a Reactive way. In the most basic and simple way possible, how can I achieve the desired behavior? The documentation for the Kendo Spreadsheet Wrapper tells me next to nothing.

I have a ref called 'this.MySpreadsheet' on the <Spreadsheet> component/wrapper and I'm given a variety of options when I log it and look at the contents. I suspect I can use a method in there to trigger some kind of 'destroy and then recreate', but I'm drawing a lot of red-herrings and in the interest of time, I'd like to be spoon-fed through this process.

render() {
        // let driver = this.MySpreadSheet.current.widgetInstance;
        // console.log('driver', driver);
        let numberOfColumns = this.sheetObject?.numberOfColumns ? this.sheetObject.numberOfColumns : 0;
        let numberOfRows = this.sheetObject?.numberOfRows ? this.sheetObject.numberOfRows : 0;
        let columnWidth = this.sheetObject?.columnWidth ? this.sheetObject.columnWidth : 50;
        console.log('render  method', this.sheetObject);
        return (
            <>
                <button onClick={() => this.changeUpSheet()}>HOKULOSOS</button>
                <div id='spreadsheet'>
                    <Spreadsheet
                        //rows={numberOfRows}
                        ref={this.MySpreadSheet}
                        //columns={numberOfColumns}
                        render={(e) => this.handleRender(e)}
                        toolbar={{
                            home: [
                                // for all available options, see the toolbar items configuration
                                // https://docs.telerik.com/kendo-ui/api/javascript/ui/toolbar/configuration/items

                                {
                                    type: 'button',
                                    showText: 'both',
                                    icon: 'k-icon k-i-file-config',
                                    click: (e) => this.handleConfiguration()
                                },
                                {
                                    type: 'button',
                                    showText: 'both',
                                    icon: 'k-icon k-i-filter',
                                    click: (e) => this.handleFilter()
                                },
                                {
                                    type: 'button',
                                    showText: 'both',
                                    icon: 'k-icon k-i-filter-clear',
                                    click: (e) => this.handleClearFilter()
                                },
                                {
                                    type: 'button',
                                    showText: 'both',
                                    icon: 'k-icon k-i-download',
                                    click: (e) => this.handleDownload()
                                },
                                {
                                    type: 'button',
                                    showText: 'both',
                                    icon: 'k-icon k-i-upload',
                                    click: (e) => this.handleUpload()
                                },
                                {
                                    type: 'button',
                                    showText: 'both',
                                    icon: 'k-icon k-i-link-horizontal',
                                    click: (e) => this.handleShareLink()
                                },
                                {
                                    type: 'button',
                                    showText: 'both',
                                    icon: 'k-icon k-i-reset',
                                    click: (e) => this.handleResetSheet()
                                }
                            ],
                            insert: false,
                            data: false
                        }}
                        sheets={this.sheetObject.sheet}
                        columnWidth={columnWidth}
                    />
                </div>
            </>

We really would like to have the possibility to add a class to the tabstriptab. 
The reason for that is we have a form over multiple tabs.
When an error occurds on a tab we want to color the background of this tab.
It already supports "contentClassName" but this is for the content container.
Is there a way around this or can this be put on a feature request list?
<TabStrip>
    <TabStripTab className="error" title="Paris">

    Paris form

    </TabStripTab>


    <TabStripTab title="New York City">

    New York City form

    </TabStripTab>

</TabStrip>

Hi.

Is there a way to highlight (entire column, header, icon in the header), or add a css class to the header / column if a grid column filter is used? I used Column Menu Filter. For example, when sorting, it is an automatic functionality (arrow icon and column highlight).

Well thank you.

Vlado.

Hello!

I am using area charts in my application that use multiple series in the chart. I want to use the Shared Tooltip to show the data for the day for all the series on the chart.

I got this working by using <ChartTooltip shared={true} />. The problem I am facing is the tooltip renders just to the right of the mouse pointer. This does not allow the user to seamlessly move the mouse to the right and see the progression of the data as the days go on because the mouse pointer moves over the tooltip and stops the sliding on the chart.

I have looked through the docs and I cant find anything on how to render the tooltip to a custom position that will move the tooltip out of the range of the mouse. Is there such a way? or a way to disable the mouseover event on the tooltip?

In the screenshot, the mouse is not captured but it is directly to the right of the tooltip. As you can see if I move the mouse right it will hover over the tooltip and wont show me for the next day.

Thanks!

Nate

how do I get the selected item ID when clicking the suggested item? 

below is my data structure. how do i get the ID instead of label?

[

{ id: 1, label: 'Label 1'},

{ id: 2, label: 'Label 2'}

{ id: 3, label: 'Label 3}

]
 
This is my component.
<AutoComplete
            data={results}
            textField="label"
            onChange={onChange}
            onBlur={onClose}
            placeholder="Search "
            value={keyword}
        />

Hi,

I am implementing grid with hierarchy view, using example below

https://www.telerik.com/kendo-react-ui/components/grid/rows/hierarchy/

but i added checkbox in the child grid where we need to select on header all the child checkbox should be selected. all works fine, but when i expand multiple childs, other child's checkbox is unchecking.

for example. i have grid with 5 rows. each rows has expand button(+) when i expand first row and check on header checkbox all child in 1st row is selected. when i expand 2nd row and do header checkbox, all the 1'st rows child is getting uncheck.

not sure how to handle this. is there any specific example or guidence?