Telerik Forums
KendoReact Forum
2 answers
51 views

Hii,

I'm using kendo inline editing feature in our grid.

This is the code for enabling the inline editing in a particular row

enterEdit = (dataItem) => {
        this.setState({
            data: this.state.data.map(item =>
                item.ProductID === dataItem.ProductID ?
                { ...item, inEdit: true } : item
            )
        });
    }

 

In this code actually we are looping the entire records right?? So my question is if i have 10000 records will i face a performance issue?

Jiyo
Top achievements
Rank 2
 answered on 28 Nov 2019
1 answer
52 views

I'm using Kendo react inline editing feature.This is my code...

 

cancel = dataItem => {
    const originalItem = this.state.DataSet.find(p => p.id === dataItem.id);
    const data = this.state.DataSet.map(item =>
      item.id === originalItem.id ? originalItem : item
    );
    this.setState({ DataSet: data, errors: [] });
    this.DataList();
  };

 

In this cancel method i'm calling this.DataList() which is a get request to the server. If i remove this line of code the inEdit is not closing.......So how can i close the inline method without writing this line?

Stefan
Telerik team
 answered on 28 Nov 2019
1 answer
169 views
My requirment is to display data from multiple Api into the grid , how can i manage the fields?
Stefan
Telerik team
 answered on 27 Nov 2019
1 answer
80 views

Attempting to following the example shown here: https://www.telerik.com/kendo-react-ui/components/charts/series-types/box-plot/.

 

But I get the error: TS2322: Type '"boxPlot"' is not assignable to type '"area" | "line" | "bar" | "donut" | "pie" | "bubble" | "bullet" | "candlestick" | "column" | "funnel" | "horizontalWaterfall" | "ohlc" | "polarArea" | "polarLine" | "polarScatter" | ... 14 more ... | undefined'.

 

However, I can use "verticalBoxPlot" (which there is no demo for, but I found in the api docs), and that works fine. Even if I go to the API documentation, "boxPlot" is missing: https://www.telerik.com/kendo-react-ui/components/charts/api/ChartSeriesItemProps/#toc-type.

Stefan
Telerik team
 answered on 26 Nov 2019
8 answers
518 views

I'd love exactly this functionality, but using KendoReact:

Working Dojo Example in response to this post

Am a bit confused as to what properties translate over to where-- how would you implement this using the Kendo React editor? Is this possible?

crimsondeal
Top achievements
Rank 1
 answered on 25 Nov 2019
2 answers
236 views

Hello,

 

Trying to add multiple Editors on a single page, and get the HTML from each. The issue is, only the most recent ref is being found when I use the following code:

 

import React from 'react';
import ReactDOM from 'react-dom';
import { Editor, EditorTools, EditorUtils } from '@progress/kendo-react-editor';
 
const { Bold, Italic, Underline } = EditorTools;
 
class App extends React.Component {
    textarea = null;
 
    setEditorRef = ref => {
      this.editor = ref
    }
 
    getHtml = () => {
      console.log(this.editor)
        const view = this.editor.view;
        this.textarea.value = EditorUtils.getHtml(view.state);
    }
 
    render() {
        return (
            <div>
                <Editor
                    tools={[
                        [ Bold, Italic, Underline ]
                    ]}
                    contentStyle={{ height: 160 }}
                    defaultContent={'<p>editor sample html1</p>'}
                    ref={this.setEditorRef}
                />
 
                <Editor
                    tools={[
                        [ Bold, Italic, Underline ]
                    ]}
                    contentStyle={{ height: 160 }}
                    defaultContent={'<p>editor sample html2</p>'}
                    ref={this.setEditorRef}
                />
                <br />
                <button
                    className="k-button k-button-icontext"
                    onClick={this.getHtml}
                >
                    <span className="k-icon k-i-arrow-60-down" />Gets HTML
                </button>
                <br /><br />
                <textarea
                    className="k-textarea"
                    style={{ height: 100, width: '100%', resize: 'none' }}
                    defaultValue="<p>textarea sample html</p>"
                    ref={textarea => this.textarea = textarea}
                />
            </div>
        );
    }
}
 
ReactDOM.render(
    <App />,
    document.querySelector('my-app')
);

 

How would I implement this?

crimsondeal
Top achievements
Rank 1
 answered on 25 Nov 2019
1 answer
879 views
I want to use the Date picker of kendo in a form.The Form is  a Dialog Box and when i Click the Date button.The Calendar displays behind the Dialog Box and  which cannot Select Any date and View the Full Calendar. 
Stefan
Telerik team
 answered on 25 Nov 2019
3 answers
922 views

I am having issues using KendoReact grid components within React Functional Components using hooks such as useEffect. One issue is that if a ExcelExport component is used, a maximum limit of state updates is reached. Furthermore if a useEffect is used pointing to the state.data of a Kendo React Grid component, the data fires off any inline grid custom column cells which includes Kendo DropDowns.

Are hooks supported yet for Kendo React components, and if not, when can we expect support?

 

My environment is using the latest versions of Redux-Toolkit, React-Redux, Redux and React.

 

Thanks,

Jim Minnihan

SKF USA, Inc.

Stefan
Telerik team
 answered on 22 Nov 2019
5 answers
583 views

https://stackblitz.com/edit/react-zbhrxe?file=Hello.js   

how can i drag a particular field in the same row, in the grid with using the reorder function.

in my grid i have star icon, which drags the entire column vertically but my requirement is to drag that star horizontally with in a particular grid column.    

Stefan
Telerik team
 answered on 22 Nov 2019
1 answer
67 views

Hello,

I'd like to report a possible issue regarding Kendo Grid. When we put filters that does not return any rows we have paging buttons enabled that are responsible for moving to next/last page. To reproduce use an example from your site and put some silly filters e.g. in CustomerId.

Stefan
Telerik team
 answered on 21 Nov 2019
Narrow your results
Selected tags
Tags
+? more
Top users last month
Henri
Top achievements
Rank 2
Iron
Iron
Iron
SUNIL
Top achievements
Rank 2
Iron
Iron
Iron
David
Top achievements
Rank 1
Jackson
Top achievements
Rank 1
Iron
Iron
Tim
Top achievements
Rank 3
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Henri
Top achievements
Rank 2
Iron
Iron
Iron
SUNIL
Top achievements
Rank 2
Iron
Iron
Iron
David
Top achievements
Rank 1
Jackson
Top achievements
Rank 1
Iron
Iron
Tim
Top achievements
Rank 3
Iron
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?