Description
I want to implement the CustomDatePicker functionality like by pressing space key the date will take current value.
const keydownevent = () => {
const datePicker = datePickerRef.current;
if (datePicker) {
const inputElement = datePicker.element.querySelector('input');
if (inputElement) {
const event = new Event('input', { bubbles: true });
inputElement.value = new Date();
inputElement.dispatchEvent(event); // Simulate the 'change' event with an empty value
}
}
}
return (
<DatePicker
{...calenderProps}
calendar={calander}
ref={datePickerRef}
placeholder="mm/dd/yyyy"
value={calenderProps.value === null ? null : calenderProps.value === undefined ? undefined : String(calenderProps.value) === "" ? null : isDateOrString(calenderProps.value) === true ? calenderProps.value : new Date(String(calenderProps.value + "T00:00:00"))}
format="MM/dd/yyyy" // Set your desired date format
/>
)
I have use this event in div onKeyDown={keydownevent} becaz kendo DatePicker is not supported the onKeyDown/onKeyPress event.
Current behavior
The keydownevent event is calling and setting the value but while executing react-dom-development.js file the value has been resets to null.
Expected behavior
the value will set as current date
Question:
Do I following the correct approach or not? if not what is the write approach?
Do Kendo CustomDatePicker not allowed the modification of date picker value form the CustomDatePicker?
I welcome any suggestions or advice