본문 바로가기

ASP.NET

[ASP.NET] - 유효성 검사 컨트롤(Validation Controls)


유효성 검사 컨트롤은 사용자가 입력한 데이터의 유효성을 판단해 주는 컨트롤입니다.
회원 가입 시 주민번호, 우편번호, 전자메일 등의 정보가 유효한지 판단할 때 사용하는 것입니다.

유효성 검사 컨트롤은 아래와 같이 있습니다.

1. RequiredFieldVaildator은 회원 가입 시 이름과 주민번호 같이 필수 입력 사항을 체크합니다.
입력을 하지 않고 버튼은 누르면 다음으로 넘어갈 수 없습니다.

2. CompareVaildator은 두 가지 값을 비교하는 데 사용됩니다.
회원 가입 시 비밀번호을 입력하고 다시 비밀번호 확인을 입력해야 합니다. 두 입력을 비교 해 비밀번호가 일치하는지 알아봅니다.

3. RangeValidator은 사용자가 입력한 값이 특정범위 안에 있는지 체크합니다.
숫자, 문자열, 날짜의 범위를 지정해 입력할 수 있게 합니다.
숫자의 경우 MinimumValue를 1로 정하고 MaximumValue를 10으로 정하면 범위는 1~10이 되는 것입니다.

<asp:RangeValidator ID="RangeValidator1" runat="server"
ErrorMessage=""1~10 사이의 숫자를 입력하세요."
ControlToValidate="TextBox1" MaximumValue="10"
MinimumValue="1" Type="Integer"></asp:RangeValidator >
  


1~10 사이 범위를 초과한 20을 입력하게 되면 "1~10 사이의 숫자를 입력하세요"라는 에러메세지가 빨간색으로 출력됩니다.


4. RegularExpressionValidator 컨트롤은 사용자가 입력한 값이 정해진 패턴을 따르는지 검사하는 컨트롤입니다.
우편번호, 전화번호, 전자메일등의 유효성 검사시 자주 사용됩니다.
우편번호는 123-456 같이 숫자로 이루어져 있는데 123-45A 같이 문자가 들어가게 되면 에러메세지가 출력되는 것입니다.

 <asp:RegularExpressionValidator ID="RegularExpressionValidator1" runat="server"
  ErrorMessage="우편번호 형식이 잘못되었습니다."
  ValidationExpression="\d{3}-\d{3}" ControlToValidate = "TextBox1" SetFocusOnError="true">
  </asp:RegularExpressionValidator >
  <p></p>
  <asp:Button ID="Button1" runat="server" Text="Button" />


ValidationExpression속성에 정규식을 지정하면 입력받을 값의 패턴을 검사 합니다. 
'\d{3}-\d{3}'에서 '\d'는 십진수를 의미하며, '{3}'은 3자리수를 입력하라는 뜻입니다.
그러므로 위 그림에 입력된 우편번호 123-45s는 자릿수는 모두 일치하지만 's'는 십진수가 아니므로 에러메세지가 출력되는 것입니다. 

ControlToValidate은 유효성을 검사할 부분을 지정합니다.
'TextBox1'이 지정되었으므로 'TextBox1'에 입력된 것만이 유효성 검사가 되는 것입니다.


5. CustomValidator 컨트롤은 사용자에 의해 입력된 값을 개발자가 임의로 만든 유효성 검사 로직을 통해 체크하는 컨트롤입니다.


 
function MultipleOfThree(source, Arguments) {
        var iValue = arguments.Value;
       
        if(iValue % 3 ==0)
            arguments.IsValid = true;
        else
            arguments.IsValid = false;
    }   

 
클라이언트측에서 유효성을 검사하는 함수입니다.
여기서 Source는 유효성 검사를 할 개체인 TextBox1을 의미하며, arguments는 유효성 검사를 할 개체의 정보를 의미합니다.
Source와 arguments는 함수 사용 시 정해진 것으로 외워두시는 것이 좋습니다.
if 문을 써서 입력한 값을 3으로 나누었을 때 나머지가 0일 경우(3의 배수이다)과 아닌 경우를 나타냅니다.
 
<asp:CustomValidator ID="CustomValidator1" runat="server"
        ErrorMessage="3의 배수가 아닙니다."
        ClientValidationFunction="MultipleOfThree" ControlToValidate = "TextBox1" >
        </asp:CustomValidator>
        <p></p>
        <asp:Button ID="Button1" runat="server" Text="Button" />  


ClientValidationFunction 속성을 통해 MultipleOfThree를 유효성 검사할 함수로 지정합니다.


3의 배수를 입력해야는데 5를 입력하고 버튼을 누르면 "3의 배수가 아닙니다"라는 에러메세지가 뜨겠죠?



6. ValidationSummary 컨트롤은 지금까지 소개한 5개의 유효성 검사 컨트롤에 의해 체크된 유효성 결과를 하나로 모아 출력해 주는 컨트롤입니다.

    아이다:
    <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
    <asp:RequiredFieldValidator ID = "RequiredFieldValidator1" runat="server"
    ErrorMessage="아이디를 입력하세요."
    ControlToValidate = "TextBox1" Text="*">
    </asp:RequiredFieldValidator><br />

    비밀번호:
    <asp:TextBox ID="TextBox2" runat="server"
    TextMode="Password"></asp:TextBox>
    <asp:RequiredFieldValidator ID = "RequiredFieldValidator2"
    runat="server" ErrorMessage="비밀번호를 입력하세요."
    ControlToValidate = "TextBox2" Text="*">
    </asp:RequiredFieldValidator><br />

    <asp:Button ID="Button1" runat="server" Text="Button" />  
    <p></p>

    <asp:ValidationSummary ID="ValidationSummary1" runat="server" />

먼저 아이디 부분의 코드를 살펴봅니다.
유효성 검사 실패 시 표시할 오류 메시지를 RequiredFieldValidator1의 ErrorMessage 속성과 Text 속성 두 군데에 지정하고 있습니다.  

ValidationSummary를 사용할 경우 에러메세지는
ValidationSummary 컨트롤에 표시됩니다.

Text 속성에 지정된 오류 메시지는 해당 RequiredFieldValidator 컨트롤에 표시됩니다.
즉 오류검사에 걸리는 곳 옆과 에러메세지 앞에 * 가 표시 됩니다.

RequiredFieldValidator2도 RequiredFieldValidator1과 마찬가지 입니다.