Skip to main content
Filter by
Sorted by
Tagged with
0 votes
1 answer
63 views

I'm new to React and since I needed to restrict the native <input type="date"> (e.g. grey out weekends and UK bank holidays), I switched to react-datepicker where it's available. Now I'...
mr_muscle's user avatar
  • 2,950
0 votes
2 answers
61 views

I'm using react-datepicker inside a Controller from react-hook-form. The component works, but I'm seeing a strange issue: Every time I interact with the DatePicker (e.g., select a date), the component ...
Itay Tur's user avatar
  • 1,972
0 votes
0 answers
48 views

I'm having a hard time making a custom header for my react datepicker component. Anytime I click on any month or the popover itself, it closes the whole datepicker component and does not change the ...
Carlos Saraiva's user avatar
0 votes
1 answer
46 views

I am importing ReactDatePicker like this const ReactDatePicker = lazy(() => import('react-datepicker')); Using same code in two different components. It's giving TypeError in one component but not ...
Jamshaid Tariq's user avatar
0 votes
0 answers
30 views

I am using the library 'react-dates' DateRangePicker in my React project. I have implemented logic where: The start date should be selectable at any time. The end date should only be selectable after ...
Abhi Patoliya's user avatar
1 vote
1 answer
419 views

I am trying to add the react-tailwindcss-datepicker to my project by following the documentation here: https://react-tailwindcss-datepicker.vercel.app/install However, I'm encountering the following ...
D Binara's user avatar
0 votes
1 answer
58 views

I'm using react-datepicker and react-input-mask to create a controlled date input. I want to update the input border color dynamically: Default state: Initial styles. On focus: When the input is ...
David Gyulinyan's user avatar
0 votes
1 answer
65 views

I want to dynamic import react-datepicker with the following: import dynamic from 'next/dynamic'; const DatePicker = dynamic(() => import('react-datepicker').then(mod => mod.default), { ssr: ...
SetNug's user avatar
  • 413
0 votes
1 answer
62 views

I have common react-components like Button, Checkbox, Datepicker etc.,. I am transpiling using the rollup.config.js. For date picker I am using react-datepicker. All these components are used in all ...
Keerthana's user avatar
1 vote
0 answers
54 views

I'm using antd RangePicker version 3.22.0. I've defined an onCalendarChange function that given a single choice, forces the other choice, thus negating the need for a second click. Problem is, the ...
Omri. B's user avatar
  • 461
1 vote
1 answer
111 views

I'm working on a custom npm package (private) with a theme so I can use it across all my projects. I'm using react-datepicker in my package to create a custom DatePicker component I have no trouble ...
Valeriia's user avatar
-1 votes
1 answer
127 views

import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs'; import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider'; import { DatePicker } from '@mui/x-date-pickers/...
Meruthiga Ravichandran's user avatar
3 votes
1 answer
152 views

I want to make a wrapper for a component. To pass all its properties I use DatePickerProps from the react-datepicker import. Why is the excludeScrollbar property required? https://codesandbox.io/p/...
anokhindev's user avatar
0 votes
2 answers
204 views

I am using react-datepicker to display a time picker component but I want the time list to be displayed in the bottom of input component but it's currently showing on top of the input field. code : &...
Alpharis's user avatar
0 votes
1 answer
555 views

I am trying to use react-hook-form with react-datepicker. I am using a button to open the datepicker, and trying to close it once the selection of a new date is made. Below is the code-sandbox I made ...
Deepak Negi's user avatar
0 votes
0 answers
78 views

In my react app I'm using react-datepicker, I added an icon using the showIcon property and it appears above the text. It might be because I'm using right-to-left bootstrap. What can I do to move the ...
3SAT's user avatar
  • 129
0 votes
1 answer
600 views

React DatePicker - Click outside day of month and calendar auto close, can't not select end date? When i clicked April 30 then React DatePicker auto close. And I not choose end date. enter image ...
user24927531's user avatar
0 votes
1 answer
301 views

I'm trying to hide the header in the react-datepicker. And from what I read it should just be the tag hideHeader. but it does not seem to be working for me. according to this, the feature was added in ...
user1255276's user avatar
0 votes
1 answer
1k views

I'm using react-datepicker with react-intl. What I want is for the date in the date picker to look like "Jan. 1, 2024" in en-US, and the correct equivalent for other locales. I believe this ...
Alesh Houdek's user avatar
  • 1,008
1 vote
1 answer
597 views

I use the react-datepicker library to select dates from the calendar in my react project with typescript. I would like to display the calendar always at the bottom of the input. This is how I ...
Vito Marseglia's user avatar
0 votes
1 answer
1k views

I am using react-datepicker. Here, I have a calendar like this one: I have a class component and inside this class component, I have a method named renderDate() method. From the class components ...
Ryan 's user avatar
  • 21
0 votes
0 answers
123 views

Very weird bug suddenly appeared. Current "@mui/x-date-pickers": "^6.9.0" - hasn't been changed for a year. So suddenly it started bugging out on some windows laptops specifically ...
Jaivardhan Deshwal's user avatar
0 votes
2 answers
1k views

I have an array of dates in "MM/DD/YYYY" format. But passing this array via the hightlightDates prop to react-datepicker is not highlighting the days on the calendar. How can I accomplish ...
Marvin's user avatar
  • 123
0 votes
1 answer
251 views

I'm using react-datePicker library which takes new Date() as input. Here I'm taking input date, time & timezone. How I can save this in the backend such that if the user selects the date Feb 10 ...
pl2ern4's user avatar
  • 375
0 votes
1 answer
523 views

I want to only show the times between 9:00 and 5:00pm. Instead, they are only grayed out: When I use: import React, { useState } from 'react'; import DatePicker from 'react-datepicker'; import 'react-...
Anna1's user avatar
  • 44
-3 votes
1 answer
185 views

I'm creating a web app and ios app simultaneously using react native via expo. I wanted to create a form that takes in a date. I use React's provided Datepicker, but I'm having issues with styling. ...
Aarsh Patel's user avatar
0 votes
1 answer
31 views

I have this test describe('Effective Date', () => { test('User select or key in valid date', async () => { debug(); const effectiveDate = screen.getByTestId('effectiveDateinput'); ...
Calvin Lin's user avatar
0 votes
2 answers
199 views

Error image const [startTime, setStartTime] = useState(moment(new Date()).toDate()); <DatePicker showIcon selected={startTime} onChange={(date) => handleStartDateChange(date)...
saranilango's user avatar
1 vote
1 answer
68 views

I'm trying to pass a Date object as payload to my formSlice but I keep getting the Error that Objects are not valid as React child or Invalid time Range when I pass the date as string with ToString() ...
saysan's user avatar
  • 11
1 vote
0 answers
62 views

I am trying to build an form to edit data, and I cannot figure out how to show the date from database (mongoDB) in the date picker input field. I'm using a formik and a react datePicker in a ...
Stephen Scott Moore's user avatar
1 vote
0 answers
218 views

My React application is running on React 17, while upgrading to latest React 18 version, below packages were upgraded with latest version, due to that not able to see the buttons and icons with below ...
Bharath's user avatar
  • 11
0 votes
1 answer
572 views

I am using a react date picker, like: <DatePicker selected={selectedDate} onChange={handleDateChange} minDate={new Date()} className="form-control" /> this is what it looks like,...
S. N's user avatar
  • 4,029
0 votes
1 answer
639 views

I'm creating a test for the react datepicker, but nothing I do seems to make it work correctly. Whenever I try adding a datepicker to my function, it throws an error. import React, { useState } from &...
Hidden Voice's user avatar
0 votes
1 answer
494 views

I have 2 DateTimePicker objects on my form, one for start time and one for end time ... At the moment they work perfect, but i am able to choose an end time that is behind the start time ... When i do ...
BigJobbies's user avatar
  • 4,095
1 vote
0 answers
410 views

I'm using React Date Picker, which I installed via npm i react-datepicker. Everything works except the calendar icon which doesn't display. The docs says to add showIcon to the JSX element to display ...
coderx's user avatar
  • 61
0 votes
1 answer
452 views

I have an api that returns the Unix time stamps of more than 50 days in a UseState variable. const [alldata, setData] = useState(null); useEffect(() => { fetch(`/getdates}`) .then((...
jot's user avatar
  • 185
0 votes
0 answers
47 views

I'm using React and trying to add a Datepicker, but the component won't display at all—-it has height and width 0x0. For reference, I'm using "react": "^18.2.0", "react-...
pls-help-me's user avatar
0 votes
1 answer
243 views

In datepicker you want to create dates in DD/MMM/YYYY format. It's okay when I make a selection using the calendar, but when the user tries to enter a value, it changes the day and month. How do I ...
ayşenur yeter's user avatar
2 votes
1 answer
2k views

So I have here <DatePicker selected={value?.toDate()} onChange={(date) => this.handleMonthChange(date)} inline showMonthYearPicker dateFormat={this.props.formatString} /> I ...
Rey's user avatar
  • 160
0 votes
1 answer
176 views

Please your help is needed. I am working on a project which requires me to only style the startDate and endDate.I am using react-datepicker library. the screenshot of what I want to achieve is down ...
Abratemmy's user avatar
1 vote
0 answers
716 views

`Just like we have the include months in month picker in react date picker by hackerone, how can we include specific quarters? Link of the date picker package : https://reactdatepicker.com/ If I enter ...
user13569341's user avatar
1 vote
0 answers
76 views

I have a React form created with Formik & Yup and I have a little problem with the submit button. The error message will be displayed if I try to click on an input field and leave. If an error ...
SnNaCk's user avatar
  • 2,992
0 votes
2 answers
2k views

I am implementing: react-datepicker: https://www.npmjs.com/package/react-datepicker My expected: But, when I change start-date and end-date, I changed border-radius for start-date and end-date, and ...
Luke's user avatar
  • 352
3 votes
1 answer
2k views

I have a bit of a complicated application where I'm making a chart based on the user input values. They pick a start date, and end date, and another parameter. When that extra parameter is filled, it ...
MKF's user avatar
  • 696
0 votes
1 answer
27 views

to be on the save side I added two way: import 'react-datepicker/dist/react-datepicker.css' is in the component. And in Admin.php I have if ( $this->plugin_screen_hook_suffix == $screen->...
János's user avatar
  • 35.5k
0 votes
1 answer
1k views

How can we set date range maximum 1 year and not more than current date in react-datepicker. I am using react-datepicker I try to use maxDate={addYears(new Date(date.start_at), 1)} in end date, It ...
Amandeep Singh's user avatar
0 votes
1 answer
479 views

here is my code, it is a typescript procjet. import React, { useState } from "react"; import ReactDatePicker from "react-datepicker"; export const DatePicker = () => { ...
fly's user avatar
  • 3
0 votes
1 answer
526 views

i have a provate repo with a uikit which i installed on a nextjs project. my prod build fails with following error: Could not find a declaration file for module 'react-datepicker'. '../node_modules/...
junray's user avatar
  • 193
0 votes
1 answer
482 views

i need to disable manual entering of the dates on my datepicker i used preventdefault but its not working this is my code <LocalizationProvider dateAdapter={AdapterDayjs}> ...
Sai Krishna's user avatar
0 votes
0 answers
920 views

I am trying to post product data using axios. When I submit my datas entered in the form, I see this error in the console : AxiosError {message: 'Request failed with status code 400', name: '...
Nassim Zemzem's user avatar

1
2 3 4 5
10