Hi
Just running into a couple issues while using the kendo react grid.The data is coming from Microsoft Graph Api.
First Issue - Date cell
Ive three date cells in my grid. To format the dates Ive used the below, however if use the following "//const value = this.props.dataItem[this.props.field];" rather than the cell name it doesn't return. I would like to keep KendoGridDdateCell generic so I can pass in all three fields. (Is this the correct way to format the cells - the data type is string and then formatted to a date.
class KendoGridDdateCell extends GridCell{ render() { const value = formatDate(new Date( this.props.dataItem.fields.MYDATEFIELD), "dd MMM yyyy")// const value = this.props.dataItem[this.props.field]; return ( <td> {formatDate(new Date(value), "d")} </td> );}}
Second Issue -Filtering
Ive set up filtering and it works for text no problem. However when I go to click on the date cell I get the following
TypeError: Cannot set property 'getCurrentStack' of undefinedsp-webpart-workbench-assembly_en-ie_2fc6beb1ff004c370718034a6380ed93.js:190[[StableObjectId]]:1message:"Cannot set property 'getCurrentStack' of undefined"stack:"TypeError: Cannot set property 'getCurrentStack' of undefined\n at setCurrentDebugStack
Sample from Grid
<Column field="fields.myDateField" title="Date" filter="date" cell={KendoGridDdateCell} /><Griddata={filterBy(this.state.gridData, this.state.filter)}filterablefilter={this.state.filter}onFilterChange={this.onFilterChange}> public onFilterChange=(event) => {this.setState({filter: event.filter});};
Also when I do filter how to I update the grid totals and paging?
Question Three
Eventually on the grid I want to have sorting, paging, filtering and grouping all on the one grid. Is there a precedence that should be followed?
<Grid data={filterBy(orderBy(this.state.gridData, this.state.sort),this.state.filter).slice(this.state.skip, this.state.take + this.state.skip)}
Question Four - Exporting Excel
I have the excel exporting working - however its only exporting visible columns - is it possible to specify the specific columns that you want in the export?
Id appreciate any help on the above
Many thanks in advance
Lori
2 Answers, 1 is accepted
Rank 1
Got question four sorted
ExcelExportColumn
https://www.telerik.com/kendo-react-ui/components/excelexport/customization/
Regarding the questions:
1) Yes, this is a possible way to do this. Another one will be to parse to the data field to a date object before passing in the to the Grid:
https://stackblitz.com/edit/react-dwfmyw-haxkr7?file=app/main.js
Also, the field approach should work as expected:
https://stackblitz.com/edit/react-dwfmyw-eyqmtt?file=app/main.js
2) If the filter is set to a date in the column, we recommend using the approach from questions one to parse the string as data, we otherwise the Grid is filtering string like a date.
3) There is a "process" method that combines all of these, it takes the data state from the onDataStateChange event. An example of this can be observed here(the HOC is not required):
https://www.telerik.com/kendo-react-ui/components/grid/data-operations/local-operations/
4) Marked as resolved.
Regards,
Stefan
Progress Telerik