Telerik Forums
KendoReact Forum
1 answer
129 views

We're experiencing an issue where a Kendo React Wrapped Grid isn't rendering the same way consistently. Sometimes it will render as expected like this:

<table role="grid" class="table table-striped table-bordered dataTable k-grid-header"> ... </table>

But other times it will render without the classes at all, which breaks a lot of the styling and sizing:

<table role="grid" > ... </table>

 

It is inconsistent across page refreshes for the same grid. In fact, it seems to be that if Chrome Dev Tools are open it will render correctly, but if they are not open then it will render incorrectly. I would have assumed it was a caching issue, but if I close dev tools and refresh the page again it reverts to the broken state.

Stefan
Telerik team
 answered on 22 Jun 2018
4 answers
265 views

layout is lost when I feed data using axios, but it is working with local data.

What I meant is instead of displaying Grid with Paging, it is displaying just Grid only.

 

working sample with local data :

https://github.com/vsaravanan/react-kendo-paging/commit/3979718024811fcd4a042711375b0058d84a936d

 

Layout is lost when I pull the data using axios.

https://github.com/vsaravanan/react-kendo-paging/commit/b1d2ce2d6088f74a41cbcc2542e5dea458563fbe

Stefan
Telerik team
 answered on 18 Jun 2018
1 answer
79 views
This is using kendo grid in react

https://codesandbox.io/s/6lyv8y3q7r
Stefan
Telerik team
 answered on 15 Jun 2018
1 answer
311 views

I am following the most basic example of using the Kendo React Grid from https://www.telerik.com/kendo-react-ui/components/grid/

I am using Webpack to bundle my files.  When I create a project with like the example above, the generated file is at /node_modules/@progress/kendo-react-grid/dist/es/main.js is 1.16 MB in size which is massive.  

My webpack.config.js file looks like

var path = require("path");
module.exports = {
    entry: {
        test: ['./src/test.jsx']
    },
    output: {
        publicPath: "/js/",
        path: path.join(__dirname, "/js/"),
        filename: "[name].js"
    },
    module: {
        rules: [{
            exclude: /node_modules/,
            loader: "babel-loader",
            query: {
                presets: ["es2015", "stage-0", "react"]
            }
        }]
    },
};

This file size makes it debugging in the browser dev tools almost impossible as the browser hangs.

I've used the React wrappers previously, the file sizes were tiny in comparison.

Is this expected or has something gone wrong in my setup?

 

Stefan
Telerik team
 answered on 31 May 2018
2 answers
129 views

I have problem with importing styles into react project using Kendo ui default style template. I have described it in more detail on stackoverflow. 

https://stackoverflow.com/questions/50576958/react-kendo-ui-styles-module-failed-to-parse-you-may-need-an-appropriate-loa

Martin
Top achievements
Rank 1
 answered on 29 May 2018
3 answers
119 views

Hello,

I am having issues with inputs and forms inside of the PanelBar component. Inputs do not allow spaces, and forms cannot be submitted when pressing enter.

My best guess is that the keyboard navigation feature of the PanelBar is preventing these from propagating. Is there a way to turn this off? I didn’t see an option in the docs.

Here’s a link to one of the example plunkers that I modified to show the issue: https://plnkr.co/edit/mgd7FRGLjAvWpEULu883?p=preview


Spencer
Top achievements
Rank 1
 answered on 28 May 2018
2 answers
131 views
 Hi, I noticed if I use the input type pagination that when I progress to the next page that the page number does not change, it stays on 1. It works this way in my app as well as the pagination demo. I haven't seen a way to directly access the page number in order to get it or update it. Is this something that is just not currently available at the moment? Or how would I update the page number?
Kara
Top achievements
Rank 1
 answered on 18 May 2018
1 answer
588 views

Hello,

 

I am currently using kendo's bootstrap 4 and had a question about button theming. How can I change the color of a button to be like the danger colored button as seen here [1]? I tried using the "color" prop that the Button component takes in but it does nothing. I can forcefully change the background through inline styling but was wondering if there was a better approach. I just figured the button styles would be supported by just saying: color=" or color="success"

 

[1] https://getbootstrap.com/docs/4.0/components/buttons/#examples

 

Stefan
Telerik team
 answered on 17 May 2018
2 answers
232 views

Is there a way too validate the dropdown and date picker with the new react components?

Thanks

Chris
Top achievements
Rank 1
 answered on 16 May 2018
1 answer
219 views

Switching the active tab with the Telerik React TabStrip component seems to always re-instantiate any components within the <TabStripTab>. This isn't an issue with basic tabs containing only text such as the examples on the Telerik website. However, some of our tabs contain heavier items like data bound charts. Re-instantiating these components on each selected tab change is too costly.

 

Is there a way to prevent this behavior? We have tried using Bootstrap's tabs and they do not have this same side effect. With bootstrap, the components contained inside the tabs are simply re-rendered.

Stefan
Telerik team
 answered on 03 May 2018
Narrow your results
Selected tags
Tags
+? more
Top users last month
Will
Top achievements
Rank 2
Iron
Motti
Top achievements
Rank 1
Iron
Hester
Top achievements
Rank 1
Iron
Bob
Top achievements
Rank 3
Iron
Iron
Veteran
Thomas
Top achievements
Rank 2
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Will
Top achievements
Rank 2
Iron
Motti
Top achievements
Rank 1
Iron
Hester
Top achievements
Rank 1
Iron
Bob
Top achievements
Rank 3
Iron
Iron
Veteran
Thomas
Top achievements
Rank 2
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?