컬럼 활용

날짜 시간 선택(datepicker, timepicker)

날짜와 시간을 선택하는 방법입니다.




1️⃣ 날짜와 시간 포맷 설정

날짜와 시간의 형식을 각각 설정할 수 있습니다.
timetype 옵션을 사용하여 다음 세 가지 중 하나를 선택할 수 있습니다.

▪️none: 날짜만 표시
▪️with: 날짜와 시간 모두 표시
▪️only: 시간만 표시
{type: "datepicker", options: {timetype: "with", timeformat: "HHmmss", timeseparator: "^"}}


2️⃣ 시간 포맷 설정

timeformat 옵션을 사용해 시간 포맷을 지정할 수 있습니다.

▪️H: 24시간 (예: 14)
▪️h: 12시간 (예: 2)
▪️m: 분 (예: 30)
▪️s: 초 (예: 45)
▪️두 글자(HH, mm, ss)로 설정 시 앞에 0을 추가합니다.

예를 들어, 시간이 한 자리 수일 경우에도 항상 두 자릿수 형식으로 출력됩니다.

=> 2:30:502:30:05
=> 14:7:914:07:09

예시 포맷: "HH:mm:ss" 또는 "h:m:s"


3️⃣ 시간 구분자 설정

timeseparator 옵션으로 시간을 구분하는 문자(예: : 또는 ^)를 설정할 수 있습니다.



4️⃣ 달력 표시 위치

direction 옵션으로 달력이 열리는 방향을 설정할 수 있습니다.

▪️up: 위쪽
▪️down: 아래쪽
{options: {direction: "up"}}