앱 만들기/HTML5

input type="week" 주 제한 하기

나도 처음이야 2023. 4. 22.

input type="week"의 min과 max 속성을 사용하면 입력받을 수 있는 주를 제한할 수 있습니다.

위 결과를 만드는 코드를 살펴보겠습니다.

  <li> 
    <label for="weekType">주차:</label>
    <input type="week" id="weekType" name="weekType" min="2023-W02" max="2023-W07" value="2023-W06" >
  </li>

id 와 name 은 해당 입력필드를 구분하기 위한 식별 자로 사용 됩니다.

min 속성은 입력 받을 수 있는 시작 주를 의미합니다.

max는 마지막 주입니다.

 

위 예제에서는 2주~7주 사이만 입력받도록 정의되어 있습니다.

주의 사항은 W02, W07 등의 표기 방식을 잘 준수해야 달력에 잘 적용이 됩니다.

추가로, week 역시 step 속성을 사용하면 한주가 아닌 여러 주를 건너뛰어 입력받을 수 있습니다.

 

2주씩 건너뛰어 입력받는 결과 화면

input type="week" 에서 min 과 max 를 사용하여 

입력 받을 수 있는 주 를 컨트롤 해보았습니다. 감사합니다.

반응형

'앱 만들기 > HTML5' 카테고리의 다른 글

<textarea> 태크 예제  (2) 2023.04.26
input type="hidden" 예제 만들기  (1) 2023.04.24
파일 첨부 form  (2) 2023.04.20
input type="button" 만들기  (0) 2023.04.18
submit 이미지 버튼 만들기  (2) 2023.04.17

댓글