Skip to Content

Date Picker Usage

사용자가 캘린더를 활용해 특정 날짜를 선택할 수 있도록 합니다.

Content

Date Format

각 나라별 데이터 포맷이 다르게 적용될 수 있습니다.

국가하루기간
북미Jan 01, 2023Jan 01, 2023 – Feb 01, 2023
유럽01 Jan, 202301 Jan, 2023 – 01 Feb, 2023
한국2023, Jan 012023, Jan 01 – 2023, Feb 01
한국어2023년 1월 1일2023년 1월 1일 – 2023년 2월 1일
기본2023-01-012023-01-01 – 2023-02-01

Placeholder

날짜 포맷을 보여주거나 문구로 보여줄 수 있습니다.

Date Picker Content Placeholder

Date Picker Content Placeholder

Behaviors

Write Date on Field

사용자가 field에 직접 숫자를 입력하여 날짜를 지정할 수 있습니다. 숫자입력시 자동으로 지정된 포맷으로 입력됩니다. (숫자만 입력 가능) 이때 필드는 Focused 상태가 됩니다.

Date Picker Behaviors Write Date on Field

Disabled Dates

Default 값으로 오늘 날짜가 선택이 됩니다. 오늘이 아닌 다른 날짜를 선택하더라도 오늘 날짜는 계속 표시해줍니다. 아직 오는 날짜 또는 지난 날짜에 대해서 Disabled 처리를 할 수 있습니다.

Date Picker Behaviors Disabled Dates
좌) 오늘 날짜와 과거의 날짜만 선택가능합니다. 우) 오늘 날짜와 미래의 날짜만 선택가능합니다.

Selected Date Range

오늘 날짜 기준으로 한달 뒤 또는 한달 전까지 날짜가 자동으로 선택됩니다.

Date Picker Behaviors Selected Date Range