사용자 입력값 검증

사용자가 입력한 입력값을 검증하는 방법을 설명합니다.

Validation 패턴, data-validation-alert, data-validation, data-validation-type, data-validation-limit 속성은 아래에 기술 합니다.

패턴 명	Value
phone-auto-hyphen	'-'하이픈이 포함된 전화번호 형식Replace 사용 가능
phone	숫자로된 전화번호 형식Replace 사용 가능
phone-compact	지역번호 등의 앞번호를 제외한 0000-0000 형식의 전화번호Replace 사용 가능
email	이메일Replace 사용 가능
domain	http 또는 https를 포함한 도메인
password-8-32	숫자, 영문, 특수문자(?=.[~!@#$%^()+-=[]{};:?.,_)형식의 8-32자 형식Replace 사용 가능
password-4-8	숫자, 영문, 특수문자(?=.[~!@#$%^()+-=[]{};:?.,_)형식의 4-8자 형식Replace 사용 가능
number	숫자Replace 사용 가능
number-alphabet	숫자 + 알파벳Replace 사용 가능
number-alphabet-underscore	숫자 + 알파벳 + 언더바('_')Replace 사용 가능
not-empty	입력 필수
ip-v4	ip v4 형식(000.000.000.000)의 IP addressReplace 사용 가능
check-limit	'data-validation-limit'속성을 통해 설정된 Checkbox의 최소, 최대 선택 수 검증
radio-check	Radio 버튼의 선택여부 검증

Tag : form

Name	Value	Description
data-validation-alert	yes 또는 미정의	입력 값 검증 오류시 alert 으로 표시

- data-validation-alert 속성은 게시물 작성, 회원가입, 웹 폼에만 해당됩니다.

Tag : input

Name	Value	Description
data-validation	Validation 패턴	상기 Validation 패턴 색션 참조
data-validation-type	replace 또는 미정의	Replace가 가능한 패턴일 경우 입력 값을 해당 패턴 형식으로 replace
data-invalid-message	String	입력값 검증에 실패시 표시할 메세지

Tag : div(Checkbox의 parent tag)

Name	Value	Description
data-validation	check-limit	선택 수 검증 패턴
data-validation-limit	1-3	'최소-최대수'형식의 최소 및 최대 선택 가능 개수

Tag : div(Radio 버튼의 parent tag)

Name	Value	Description
data-validation	radio-check	Radio 버튼 선택 필수

시작하기