react-day-picker is a flexible date picker component for React
Read the react-day-picker documentation and check out the examples to learn how to implement it.
Questions tagged [react-day-picker]
129 questions
3
votes
2 answers
Adding onChange logic to third-party react-day-picker element
I'm trying to integrate react-day-picker's DayPicker with react-final-form.
React Final Form requires the use of a Field for each form field, which means creating an adapter component whenever you want to a third-party form element to be usable…
Paul Craig
- 31
- 4
3
votes
4 answers
Disable all future days in React-Day-Picker?
I have a date range calendar using react-day-picker. It works beautifully aside from me not being able to disable "all" future days from the selection. The api docs show that you can enter a single day or multiple days but not all future days?
…
micahblu
- 4,924
- 5
- 27
- 33
3
votes
3 answers
How to onFocus and onBlur a React/Redux form field that's connected to React Date Picker?
I've got this simple v6 redux-form with an input that renders a custom component that populates its value using react-day-picker.
https://github.com/gpbl/react-day-picker
I chose react-day-picker over others because it doesn't depend on moment.js…
Kyle Truong
- 2,545
- 8
- 34
- 50
3
votes
3 answers
How to import css file for into Component .jsx file
I am trying to use the react-day-pickers component like so but I can't figure out how to import the .css file and I keep getting the error:
Module parse failed:…
letter Q
- 14,735
- 33
- 79
- 118
2
votes
0 answers
What is the best way to compare dates with date-fns without locale influence
What is the most proper way of comparing two dates, I have a holidays array from google, and dates fetched from react-day-picker, I transform them to be in JSON format with date.toJSON() method and with the dates from google I get following…
seven
- 1,183
- 14
- 33
2
votes
0 answers
Weekly callendar view in react-day-picker
I am using react-day-picker in a project and I need a week view in calendar widget so that i could display booked events per week, has anyone tried to implement this feature and is it possible with this lib? There is…
seven
- 1,183
- 14
- 33
2
votes
0 answers
React-Day-Picker DayPicker Component Not Closing When Clicking Outside Calendar
I am having an issue utilizing the DayPicker api for use of the pop-up calendar. I need to close/hide when I click outside the calendar. I want to work like the DayPickerInput component work but with our the textbox input. I ONLY need the popup…
that_developer
- 319
- 2
- 9
2
votes
1 answer
Formik touched with react-day-picker
I have DayPickerInput set up in my Formik form.
setFieldValue('hire_date', date)}
…
S.B
- 311
- 2
- 22
2
votes
0 answers
Scroll DayPicker to selected days months
I am using DayPicker in overlay. I have set the selected from date as 17th August 2020 and I am setting DayPicker to show months from current to 12 months onward.
I want my DayPicker to scroll into selected date month (which is August in our case).…
Rahul Jain
- 369
- 1
- 13
2
votes
1 answer
Listen to react-day-picker input 'change' event
I am using the react-day-picker library to display a date picker on my site. I would like to listen for when the date has been changed. I know there are onDayChange hooks you can add to the DayPickerInput components, but I want to listen for a…
user1063998
- 584
- 6
- 16
2
votes
0 answers
How to add icon in react-day-picker DayPickerInput
I have been unable to add a calendar icon into the DayPickerInput component.
I have tried
import {FaCalendar} from "react-icons/fa";
}
/>
i get the following
Warning:…
Diego
- 594
- 2
- 10
- 29
2
votes
0 answers
React-Day-Picker- Disabling dates and selecting from range of dates
I have a 2-month calendar where I would like the user to be able to select a date from a range of 8 weeks, but only starting from 3 weeks after the current date.
For example, if the current date is Monday December 23, 2019, the first open date that…
Lucy
- 31
- 2
2
votes
1 answer
How to refer 'this' keyword in React Stateless Component
Am trying to create a React Stateless Components for input range day picker using library day-picker.
If I try to convert the Stateful Component to Stateless, the this keyword is not accessible, since Stateless components doesn't have the scope for…
user12133234
- 371
- 2
- 5
- 15
2
votes
1 answer
How to make the react-day-picker wide to fill all the screen in a web app mobile version
The problem is I can't find an appropriate way with CSS styling to make the react-day-picker wide enought to fill out all a mobile display.
I've tried to customize the css file provided by react-day-picker and a lot of styles were applied but all…
Ihor
- 131
- 1
- 6
2
votes
1 answer
Make all dates except for certain ones disabled
I am trying to make it so that in react-day-picker, only the dates that are available are selectable (i.e. A user is only available for two days, all those other days are disabled and unselectable). I've tried doing this method:
Alex Masson
- 31
- 1
- 4