Stack Overflow
Stack Overflow

Questions tagged [react-day-picker]

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.

129 questions
0
votes
1 answer

Limit react-day-picker range to x days

I want to limit the range length in react-day-picker to e.g. 10 days. How should this be done, is something availlable in the package already? This is an example range selector: https://react-day-picker.js.org/examples/selected-range/
Hoetmaaiers
  • 3,413
  • 2
  • 19
  • 29
0
votes
2 answers

Solved: React-day-picker Daypicker Input loses focus when using custom input component

The working sandbox is https://codesandbox.io/s/react-day-picker-base-h9fv6 I have been trying to implement a simple day picker input, where you can both enter the date in the input field and select in the picker. The problem is that when I use a…
Cornelius
  • 351
  • 2
  • 6
  • 14
0
votes
1 answer

Inputing date on react-day-picker input formatted with date-fns

I can't type the date manually with react-day-picker using onDayChange but I can when I use an onChange. However, I do not get the selected value with an onChange and also I am using date-fns to format the date. handleChangeDate(date, value) { …
Racheal
  • 1
  • 1
0
votes
1 answer

Dynamic date selected and current month is not displayed

This is my problem link I am passing dynamic date array and getting month based on the current date but it is not working. This is reference link
Harsh Patel
  • 6,334
  • 10
  • 40
  • 73
0
votes
1 answer

React day picker return all data when expecting only day

So I'm using react-day-picker, for calendar. import DayPickerInput from 'react-day-picker/DayPickerInput'; import 'react-day-picker/lib/style.css'; This is the function I use : this.onEduGraduateFromChange(d,…
Piter
  • 57
  • 7
0
votes
1 answer

Is it possible to modify a cell of the react-day-picker with an image?

i am currently working on a project and would like to modify individual cells of the react-day-picker. The usual modifiers are not enough for me, because I want to replace the number of days with a smiley (picture). Example of a modified cell with…
Luke
  • 1
0
votes
1 answer

Display 2 calendars (Georgian, and Hijri) per each day

How can I display Georgian and Hijri day on each day using react-day-picker? the target is something like this
Mustafa Magdy
  • 1,230
  • 5
  • 28
  • 44
0
votes
1 answer

React Day Picker: How to disable interaction with disabled dates in "Select Multiple dates"

How can I disable click on dates in "Selecting multiple dates". Inside my render, I am able to disable days…
TEMP
  • 235
  • 2
  • 7
  • 17
0
votes
1 answer

Using 'react-day-picker' DatePickerInput within a Bootstrap Modal

I am trying to use a DatePickerInput component within a bootstrap modal. I am expecting a similar effect to this, as demonstrated on the official website. However, inside the bootstrap modal, I get this. I suppose that this is because the library…
Haowen Liu
  • 147
  • 1
  • 1
  • 10
0
votes
1 answer

React-day-picker disabledDays before after and array

So im trying to disable days in react-day-picker with before after and array parameters. This will only disable before and after disabledDays={[ {after:moment().add(1, 'months').toDate()}, {before:moment().toDate()}, …
TOBE
  • 112
  • 1
  • 5
0
votes
1 answer

How to properly use hideDayPicker() public function from react-day-picker-input?

I'm trying to hide my calendar by clicking the react-day-picker-input element again (it will open when you click it by default). For that, I have a state that records true or false when you click the element. The problem is that when I click again…
Abak
  • 41
  • 1
  • 11
0
votes
1 answer

Not possible to enter date manually in react-day-picker

When entering a date manually, i.e. without using the day picker, no event is triggered. It should be possible to enter dates manually without using the picker.
Gunnar Siréus
  • 162
  • 1
  • 6
0
votes
1 answer

DayPickerInput allows to manually delete date after picking it up (need to prevent this)

I'm using the following to prevent default on other input fields, but doesn't seem to work completely on my DayPickerInput. //Prevent default function onKeyPress = (event) => { event.preventDefault(); } //DayPickerInput
Abak
  • 41
  • 1
  • 11
0
votes
1 answer

React day picker doesn't update class name after simulating click event through enzyme

I'm using React day picker and trying to write some tests for it. One of the tests includes simulating click on a particular day and then checking the class name of that day whether it has added the selected class to it or not. But the problem is,…
Rahul Dole
  • 2,723
  • 2
  • 24
  • 30
0
votes
2 answers

Create custom component input for react-day-picker

I was creating a custom materiel UI component for DayPickerInput, but the problem is when onDayChange is fired,it gives an error. handleToDateChange = (selectedDay, modifiers, dayPickerInput) => { const val =…
wahdan
  • 1,208
  • 3
  • 16
  • 26
1 2 3
…
8 9