Client Validation

Client쪽 validation을 스텝바이스텝으로 알아보자.
  • validate라는 속성을 true로 정의한다.
  • 몇몇 테마에서는 client쪽 validtion을 지원하지 않는다.

Step 1

폼을 작성.

<html>
<head>
    <title>Validation - Basic</title>
    <s:head/>
</head>

<body>

<b>What is your favorite color?</b>
<p/>

<s:form method="post" validate="true">
    <s:textfield label="Name" name="name"/>
    <s:textfield label="Age" name="age"/>
    <s:textfield label="Favorite color" name="answer"/>
    <s:submit/>
</s:form>

</body>
</html>

<s:head />라는 테그에 의해서 default xhtml테마가 적용되었다.

Step 2

Action을 작성

public class QuizAction extends ActionSupport {

    private static final long serialVersionUID = -7505437345373234225L;

    String name;
    int age;
    String answer;

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public int getAge() {
        return age;
    }

    public void setAge(int age) {
        this.age = age;
    }

    public String getAnswer() {
        return answer;
    }

    public void setAnswer(String answer) {
        this.answer = answer;
    }
}

Step 3

validation.xml파일에 validator에 대해 기술.

<!--
    아래와 같이 DOCTYPE 정의를 XXX-validation.xml 파일의 첫 번째 줄에 기술한다.
    <!DOCTYPE validators PUBLIC "-//OpenSymphony Group//XWork Validator 1.0.2//EN" "http://www.opensymphony.com/xwork/xwork-validator-1.0.2.dtd">
-->
<validators>
    <field name="name">
        <field-validator type="requiredstring">
            <message>You must enter a name</message>
        </field-validator>
    </field>
    <field name="age">
        <field-validator type="int">
            <param name="min">13</param>
            <param name="max">19</param>
            <message>Only people ages 13 to 19 may take this quiz</message>
        </field-validator>
    </field>
</validators>

Action과 네임영역

<s:form>테그에는 Action명과 네임영역을 정확하게 기술해야 한다. quizCliet라는 Action명과 /validation이라는 네임영역 정의 되어 있다고 하면 아래와 같이 form를 기술해야 한다.

<s:form method="post" validate="true" action="quizClient" namespace="/validation">
   <s:textfield label="Name" name="name"/>
   <s:textfield label="Age" name="age"/>
   <s:textfield label="Favorite color" name="answer"/>
   <s:submit/>
</s:form>

아래와 같이 정의한 경우, form은 동작한다 할 지라도 client-side validation은 동작하지 않는다. 

<s:form method="post" validate="true" action="/validation/quizClient.action">
   <s:textfield label="Name" name="name"/>
   <s:textfield label="Age" name="age"/>
   <s:textfield label="Favorite color" name="answer"/>
   <s:submit/>
</s:form>


Comments