본문 바로가기
윅스 (Wix) 홈페이지 만들기/윅스 코딩 (Wix Code - Corvid)

윅스 (Wix) 코딩 - 설정 패널에서 사용자 입력 유효성 검사하기 (Wix Code: Working with User Input Validation in the Settings Panel)

by 라임쥬서(Lime Juicer) 2020. 5. 5.
반응형

윅스 (Wix) 코딩 - 설정 패널에서 사용자 입력 유효성 검사하기 (Wix Code: Working with User Input Validation in the Settings Panel)

 

 

 

설명)

 

양식을 작성할 때 사용자 입력이 데이터베이스 컬렉션에 추가되기 전에 유효성을 검사할 수 있습니다. 양식에 입력된 데이터의 유효성을 검사하여 예상한 데이터를 받고 올바른 형식인지 확인합니다.

 

가능한 경우 사용자 입력 유효성 검사를 통해 사용자가 잘못된 값을 입력하지 못하게 해야합니다. 유효하지 않은 데이터가 입력되는 것을 막을 수없는 경우 제출하기 전에 데이터를 확인하고 유효하지 않은 경우, 이를 사용자에게 알려야합니다.

 

사용자 입력 요소의 설정을 사용하여 입력란(필드) 수준 유효성 검사를 설정할 수 있습니다. 추가 유효성 검사는 코드를 사용하여 추가할 수 있습니다.

 

필수가 아닌 유효성 검사는 값이 없는 입력 요소에서 실행되지 않습니다.

 

 

 

필수 (Required)

대부분의 사용자 입력 요소에는 필수 옵션이 있습니다. 입력 요소를 필수로 설정하면 해당 입력란(필드)에 값이 없는 경우 양식이 제출되지 않습니다.

 

체크박스가 필수로 설정되어 있으면 유효한 것으로 간주되도록 선택해야합니다. 스위치에는 필수 옵션이 없습니다.

 

입력 요소 (Input Elements)

입력 요소는 다양한 유형의 정보를 수용하도록 구성 될 수 있습니다. 각 유형은 사용자가 특정 값만 입력할 수 있게하고, 사용자가 값 입력을 완료하면 특정 유형의 유효성 검사를 수행하며, 다른 유형의 추가 유효성 검사를 추가하게합니다.

 

입력 유형(Input   Type)

유효성 검사(Validation)

추가 유효성 검사(Additional Validations)

텍스트(Text)

없음

길이 제한, 패턴

암호(Password)

없음

길이 제한, 패턴

숫자(Number)

값은 숫자입니다.

최대 값, 최소 값, 패턴

이메일(Email)

값은 이메일 주소입니다.

패턴

URL

값은 "http" 이나 "https"으로 시작하는 URL입니다.

패턴

전화번호(Phone Number)

값은 전화번호입니다.

패턴

 

길이 제한 (Limit Length)

길이 제한을 설정하면 값의 길이가 제한을 초과하는 경우 양식이 제출되지 않음을 의미합니다.

 

최대 및 최소 (Maximum and Minimum)

숫자 유형의 입력 요소를 사용하여 최대 값, 최소 값 또는 둘 다를 설정할 수 있습니다. 이러한 제한 중 하나를 설정하면 입력한 값이 설정된 제한 내에 있지 않으면 양식이 제출되지 않습니다.

 

패턴 유효성 검사 (Pattern Validation)

입력 요소의 일부 유형을 사용하면 설정에서 패턴 유효성 검사를 추가할 수 있습니다. 패턴 유효성 검사는 검색 패턴을 정의하는 문자 및 기호 문자열인 정규 표현식을 사용하여 수행됩니다.

 

예를 들어 사용자가 사용자 이름을 입력하게 하려는 입력 요소가 있다고 가정해 봅시다. 그리고 사용자 이름에 대한 규칙은 영숫자와 밑줄로 구성되어야한다는 것입니다. 또한 5자에서 20자 사이이어야 합니다.

 

다음은 유효한 사용자 이름만 허용하도록 입력 요소에 추가할 수 있는 정규 표현식입니다.

 

^ [a-zA-Z0-9 _] {5,20} $

 

이 식에서 ^와 $는 각각 문자열의 시작과 끝을 나타냅니다. 이러한 기호 안에는 두 개의 섹션이 있습니다. 하나는 대괄호 []로 묶고 다른 하나는 중괄호 {}로 묶습니다. 대괄호 [a-zA-Z0-9_]로 묶인 섹션은 소문자 a-z, 대문자 A-Z, 숫자 0-9 또는 밑줄 _과 일치합니다. 중괄호 {5,20}로 묶인 섹션은 바로 앞에 오는 섹션 인 [a-zA-Z0-9_]와 일치하는 5 - 20자를 의미합니다.

 

날짜 선택기 (Date Pickers)

날짜 선택기를 사용하면 입력할 수 있는 날짜를 제한할 수 있습니다. 지난 날짜, 미래 날짜 또는 주중과 같이 사용자가 지정한 요일에 해당하는 날짜를 선택하지 못하도록 제한할 수 있습니다. 또한 MM / DD / YYYY 또는 DD / MM / YYYY 형식으로 날짜 형식을 제어할 수 있습니다.

 

 

 

 

 

연관된 토픽)

 

 

윅스 홈페이지 만들기 101

윅스 (Wix) 홈페이지 만들기 101 - E-Book - Index

 

윅스 (Wix) 홈페이지 만들기 101 - E-Book - Index

윅스 (Wix) 홈페이지 만들기 101 - E-Book - Index 윅스 (Wix.com) 윅스 ADI & 템플릿 (Wix ADI & 템플릿) 윅스 웹에디터 (Wix Editor) 윅스 코딩 (Wix Code - Corvid) 윅스 해커톤 (Wix Hackathon)

limejuicer.tistory.com

 

출처 :

https://support.wix.com/en/article/working-with-user-input-validation-in-the-settings-panel

 

반응형

댓글