Telerik Forums
KendoReact Forum
1 answer
29 views

 

Hi Support,

I just wondering on how to change the date format on Scheduler components (look picture below, those start and end section). At the moment my date format is coming up as month/day/year, but what i want is day/month/year.

 

This is the KendoUI React Scheduler i am using on my code. 

 

I tried to look at  your api online but still couldn't get the solutions. Please give me advice.

 

Thanks

 

John

 

 

 

Konstantin Dikov
Telerik team
 answered on 12 Feb 2024
0 answers
19 views

Hi , Here is the code we are using for datetimepicker , kindly have a check , 

 <IntlProvider locale={this.currentLocale}>
                                {isDateTimePicker ?
                                    <DateTimePicker
                                        value={this.state.fieldValue}
                                        onChange={this.changeDate}
                                        width={width}
                                        format={getLocaleDateString(window.navigator.language, isDateTimePicker)}
                                    /> :
                                    <DatePicker
                                        value={this.state.fieldValue}
                                        onChange={this.changeDate}
                                        width={width}
                                        format={getLocaleDateString(window.navigator.language)}                                        
                                    />
                                }
                            </IntlProvider>
Mounikareddy
Top achievements
Rank 1
 asked on 22 Jan 2024
1 answer
38 views

Greetings,

I'm having an issue with the Date filter when the grid contains null date values.
I'm currently using the following operators for the Date filter:

{ text: 'grid.filterAfterOperator', operator: 'gt' },
{ text: 'grid.filterBeforeOperator', operator: 'lt' },
{ text: 'grid.filterIsNullOperator', operator: 'isnull' },
{ text: 'grid.filterIsNotNullOperator', operator: 'isnotnull' }

The "Is null/Is not null" operators are working but the "Is before/Is after" operators are not filtering out the null values.
Is there a way to fix this? Thanks!

Jason

Konstantin Dikov
Telerik team
 answered on 22 Dec 2023
1 answer
28 views

Hello,

Currently we are getting an error for missing locale info for 'hr' but not for 'en' when adding DatePicker input in the scope of the project (DateTimePicker and TimePicker workds just fine).

We are loading all the data needed with the cldr packages so cldr-core (likelySubtags, currencyData, weekData), and cldr-number-full and cldr-dates-full for these two locales. For hr locale it gives an error saying missing locale info for 'hr' pointing at the split-date-format.js but when we change to 'en' locale and pass it to IntlProvider and LocalizationProvider it goes without problem.

We would appreciate some feedback for this or atleast an escape hatch for a while becuase we want to use DatePicker component.

Best regards.

Filip
Telerik team
 answered on 05 Dec 2023
0 answers
41 views

Hello everyone

 

I need to implement a DatePicker with a section with prefilled dates for the User.

Here is my implementation - https://stackblitz.com/edit/react-t6vo2n 

I have a problem - when you click on the prefilled date the DatePicker doesn’t take the date. If you click very quickly the DatePicker can take the date. I suppose that it appears because the popup starts unmounting. I suppose the unmounting cause is that the calendar lost focus when the User clicked any area in the prefilled dates section.

Can I somehow prevent this?


 
Kostiantyn
Top achievements
Rank 1
 asked on 01 Dec 2023
1 answer
43 views

Hi,

I have a scenario where I do not want to show the placeholder in the date filter of UI Grid until the user clicks it. I achieved that using the example given here Kenod Grid - StackBlitz. With this implementation, I'm getting an issue where the filter placeholder doesn't disappear when a browser tab is changed. It only disappears when the area is focused and then clicked outside. This is continuously visible on chromium-based browsers react-bh72m1-a3qerg.stackblitz.io

 

Konstantin Dikov
Telerik team
 answered on 17 Oct 2023
0 answers
36 views
Hi
Shahbaz
Top achievements
Rank 1
 asked on 10 Oct 2023
1 answer
182 views
Hello,

Some of our users prefer to type the date instead of selecting it in the datepicker. 
When user starts typing data, they usually starts with Date, then month and then Year.

One of your user is trying to enter leap year date in the picker and Kendo datepicker is defaulting to 28th Feb.
User typed 29 for day and when he typed 02 as month, it's changing date to 28 without waiting for year to be entered.

Is there a possibility to restrict this? We want no validation to happen until user enters the whole date. MUI datepicker works in the similar way. is there a way to achieve that in Kendo Datepicker?
Wissam
Telerik team
 answered on 04 Sep 2023
1 answer
42 views

How do I force date selection via the popup calendar for the datepicker control?

We would like to prevent keyboard entry because it allows entering values before the set min date.

 

Thanks,

Adam

Konstantin Dikov
Telerik team
 answered on 21 Jun 2023
1 answer
670 views

This problem seems to affect new version of Chromium browsers. As of this writting, the bug can be replicated on these browsers:

-GoogleChrome 113.0.5672.93

-Microsoft Edge 113.0.1774.42

-Brave Browser 1.51.114

The problem doesnt appear on Firefox or older verions of Chromium browsers (tested on v103.0.5046.0)

 

Replication Steps

1) Click on the Calendar icon of the DatePicker

2) Click on a Month on the left Column (IMPORTANT: Don't scroll using the mouse wheel)

3) Pick a Day on the Month that was picked in step 2. For example, I pick Feb 10th, the date is set to June 10th for some weird reason.

The problem only happesn if one picks the available list of Months on step 2 without scrolling using the mouse wheel.

 

For some reason, this bug cannot be replicable on StackBlitz (I wonder if their background code prevents some kind of Racing Conditon). But I have attempted a brand new project on a different machine with just he date picker and it is replcated on the new Chromium based browsers mentioned above.

import React from "react";
import "./App.scss";
import { DatePicker } from "@progress/kendo-react-dateinputs";

function App() {
    const [date1, setDate1] = React.useState<Date | null>(() => new Date());

    return (
        <div>
            <DatePicker
                id={"kendo-date-sample"}
                value={date1}
                onChange={(e) => {
                    const newDate = e.value;
                    console.log(newDate);
                    setDate1(() => newDate);
                }}
            />
        </div>
    );
}
export default App;


Vessy
Telerik team
 answered on 15 May 2023
Narrow your results
Selected tags
Tags
+? more
Top users last month
Mark
Top achievements
Rank 1
Yurii
Top achievements
Rank 1
Leland
Top achievements
Rank 2
Iron
Iron
Iron
Hon
Top achievements
Rank 1
Iron
Deltaohm
Top achievements
Rank 3
Bronze
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Mark
Top achievements
Rank 1
Yurii
Top achievements
Rank 1
Leland
Top achievements
Rank 2
Iron
Iron
Iron
Hon
Top achievements
Rank 1
Iron
Deltaohm
Top achievements
Rank 3
Bronze
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?