Hello,
I've this issue in my project with my data grid toggle in edit mode :
Part of my package.json
"@progress/kendo-data-query": "^1.5.5", "@progress/kendo-drawing": "^1.10.1", "@progress/kendo-licensing": "^1.1.4", "@progress/kendo-react-animation": "^4.7.0", "@progress/kendo-react-data-tools": "^4.7.0", "@progress/kendo-react-dateinputs": "^4.7.0", "@progress/kendo-react-dropdowns": "^4.7.0", "@progress/kendo-react-grid": "^4.7.0", "@progress/kendo-react-inputs": "^4.7.0", "@progress/kendo-react-intl": "^4.7.0", "@progress/kendo-react-layout": "^4.7.0", "@types/react-transition-group": "^4.4.1",
Parts of my render code :
<Grid filterable={false} pageable={true} sortable={false}
data={dataSource}
reorderable={true}
onItemChange={this.itemChange}
editField={"inEdit"}>
<Column title="Ligne">
<Column field="NoLig" width="50px" cell={this.cellFormat} />
<Column field="FlagAnnul" width="50px" cell={this.cellFormat} />
<Column field="Classification" width="64px" cell={this.cellFormat} />
</Column>
</Grid>
function cellFormatting
cellFormat = (props) => {
const { dataItem } = props;
const { dataBinding } = this.state;
let value = props.dataItem[props.field];
let editor = "";
let max = 0;
let min = 0;
let maxLength = 0;
let formatOptions = "";
let valueDate = null;
const index = dataBinding.dataScheme.findIndex((o) => o.Name === props.field);
if (index > -1) {
const scheme = dataBinding.dataScheme[index];
editor = scheme.Type;
switch (editor) {
case "boolean":
break;
case "text":
maxLength = scheme.MaxLength;
break;
case "date":
valueDate = moment(value, 'DD/MM/YYYY').toDate();
break;
case "int":
if (value)
value = parseInt(value);
min = parseInt(scheme.Min);
max = parseInt(scheme.Max);
formatOptions = "n0";
break;
case "float":
if (value)
value = parseFloat(value);
min = parseFloat(scheme.Min);
max = parseFloat(scheme.Max);
formatOptions = "n" + scheme.Min.split(",")[1].length;
break;
}
}
return (
<td colSpan={props.colSpan}
className={props.className}
role="gridcell"
aria-colindex={props.ariaColumnIndex}
aria-selected={props.isSelected}
expanded={props.expanded.toString()}
data-grid-col-index={props.columnIndex}
editor={editor}>
{dataItem.inEdit ? (<>
{editor === "boolean" && (<Input />)}
{editor === "text" && (<Input field={props.field} maxLength={maxLength} defaultValue={value} onChange={(e, dataItem) => this.cellValueOnChange(e, props.dataItem)} />)}
{editor === "date" && (<DateInput field={props.field}
defaultValue={valueDate}
data-required-msg=""
validationMessage="" />)}
{(editor === "int" || editor === "float") && (<NumericTextBox field={props.field} max={max} min={min} format={formatOptions} defaultValue={value} onChange={(e, dataItem) => this.cellValueOnChange(e, props.dataItem)} />)}
</>) : (value)}
</td>)
};
I tried add this 2 attributes in props of DateInput element but no success :
data-required-msg=""
validationMessage=""
I need hide this tooltip.
I've same issue this DatePicker too !!!
Do you know how resolve this issue, please ?
Thank you
Cyril REILER
<LocalizationProvider language="fr-FR">
<IntlProvider locale="fr" >
//////////////////////////////////////
</IntlProvider>
</LocalizationProvider>
Could you please share a runnable example of the issue, as it could be caused by a small detail that we are currently missing?