Hi
Trying to get the date filters working on my grid. My dates are returning via an API call - all the dates are in ISO date format.
I've implemented the GridCell as follows but noted that formatDate returns a string rather than a date - is this correct?
class KendoGridDdateCell extends GridCell{
public render() {
var value = formatDate(new Date( this.props.dataItem[this.props.field], "d")
return (
<
td
>
{value}
</
td
>
);
}
}
Also on the grid itself after turning on the date filters for the cell the
<
Column
field
=
"fields.myDateFild"
title
=
"date"
filter
=
"date"
cell={KendoGridDdateCell}/>
The Filter itself always shows Month/Day/year - how can we make the filter show Day/Month/Year? Without this the dates filter wont work.
Any help or pointers on this would be fantastic.
Hey,
we implemented the StockChart and set the NavigatorCategoryAxis to type "category". Everthing works as it should.
Is there a possibility to set ChartNavigatorSelect "from" and "to" props to a number, so we can set a range ? Or is there a workaround for type category ?
Thanks for your help.
With best regards
Stefan
I am using the GridPDFExport in my application. While doing so , I am facing following queries :
1. The background of the grid is by default shown in the fashion that white and grey colors get applied to the alternate rows. I have customized the background color for the grid but that styling disappears on Export PDF.
2. Unable to change the Font and Color while exporting the Grid in PDF document. Increasing the scaling property doesn't work for my scenario as there are large number of columns i want to export. Thus my scale is set to 0.3. I have to increase the Font as well change the font color while exporting the Grid.
Even after using PageTemplate , it didn't work for me.
Kindly suggest the suitable solution.
Hi,
I am trying to set maxLength property to NumericTextBox, but it is not working. Is it not supported?
example
maxLength="5"
Regards,
Parag
Hi,
I have a chart with radio buttons above that switch between "month" and "day" data. When I change the data set to monthly by updating the categories and series of the chart, the x-axis is still displaying the daily labels. I searched the documentation and don't see a "refresh" method like the one available for the jQuery version. Can you please provide a React example of how to update a chart with a new data set?
Your help is appreciated,
Mihai
As of v2.0.0 for the Dropdown components, the valueField prop was removed. An example of how to re-implement the feature is provided here:
https://www.telerik.com/kendo-react-ui/components/dropdowns/combobox/common-scenarios/#toc-using-data-fields-for-values
The thing for me was that I am using TypeScript and needed a type safe withValueField HoC so I copied the existing HoC and added some type safety. I figured it would be helpful for any of those that are looking for the same thing.
Check it out here: https://gist.github.com/Weffe/c69304a00e5f955a13cae65bbcb0a86d
Enjoy!
In another thread named: "", it was discussed how to set the focus to a grid cell in a KendoReact Grid control. Here's the example provided from that thread:
>>
"This can be done by selecting the desired element based on a query selector and calling its focus method:
https://stackblitz.com/edit/react-lthy76?file=app/main.js"
<<
That's a pretty good example, however in real UX it doesn't work that way....
Under a normal use case for UX, you would not want the user to have to press a button such as "Focus Input" or "Focus Textbox" prior to then selecting an inline Edit button. What users would more likely want to see is when they press the inline grid Edit button that the focus immediately appears on the particular column that starts the editing.
Thus, in my use case, I have a single editable textfield inside a Grid, and using the code from the example in stackblitz above,
i.e. >>
let firstInput = document.getElementsByClassName('k-textbox')[0];
if (firstInput) {
firstInput.focus();
}
<<
inside an enterEdit(dataItem) function called from an Edit command cell (from code grabbed from the KendoReact Grid documentation)
the result is that firstInput is always "undefined" and focus is never given to that cell.
BTW, Here's the full enterEdit() routine:
enterEdit = (dataItem) => {
this.setState({
originalItem: dataItem
});
this.updateGridData(this.state.data, dataItem).inEdit = true;
this.setState({
data: this.state.data.slice()
});
let field = document.getElementsByClassName('k-textbox')[0];
if (field) {
field.focus();
}
};
Is there a reason why the field is always "undefined"? Could this be a timing issue? Does the focus need to be preset prior to a call for editing?
Can anyone shed some light on this issue?
Thanks,
Jim Minnihan
SKF, Inc.
I find that I must explicitly set a width in order for a Kendo React Chart to fill the parent's width if it is inside a Kendo React TabStrip.
This is true for any version of kendo-react-layout newer than 1.2.0-dev.201806281338.
This demonstrates the issue: https://stackblitz.com/edit/react-armuz6
Notice the chart outside of the TabStrip takes up the available width but the chart inside the TabStrip does not.
Also worth noting that other components that I nest inside of the TabStrip do not exhibit this. They take up the full width as expected.