datetimedatepickerhideantd

Is it possible to hide dates from previous/next months in Antd DatePicker/RangePicker?

Ref: Antd DatePicker

I'm using the Ant Design RangePicker specifically and would like to only show dates from the current month (eg. under Feb, 1 - 28, and under Mar, 1 - 31).

The default displays some of the previous month's dates, as well as some of the next month's dates.

Is this possible?

Antd RangePicker, comparing default to the desired result.

Solution

  • You can achieve your goal by using some CSS styles, like this:

    .ant-picker-date-panel .ant-picker-cell:not(.ant-picker-cell-in-view) .ant-picker-cell-inner {
  display: none;
}

.ant-picker-date-panel .ant-picker-cell:not(.ant-picker-cell-in-view) {
  pointer-events: none;
}

    I've implemented an example Here on Stackblitz, you can check it out and find the example source code.