manual(ver <= 0.2.0)

AXU4J 사용방법

install

1. download /dist/axu4j.xml (AXU4J config file) copy to /WEB-INF/classes/ folder
2. add dependency pom.xml

<dependency>
	<groupId>com.axisj</groupId>
	<artifactId>axu4j</artifactId>
	<version>0.2.0-RELEASE</version>
</dependency>

Custom Tag API

---

layout

페이지에 사전에 정의한 레이아웃을 적용하는 tag입니다. 레이아웃 페이지는 HTML 파일로 작성을 하며 mustache 문법을 사용해서 원하는 부위에 내용을 위치할 수 있습니다. 레이아웃 페이지에 {{name}}(HTML escaped), {{{name}}}의 표현식을 사용하면 div tag의 내용이 해당 위치에 삽입됩니다.

attributes

• name 페이지에 사용할 layout name입니다. axu4j.xml에 설정한 prefix(default: /WEB-INF/layouts/)와 suffix(default: .html)를 제외한 파일명을 그대로 사용하면 됩니다.

example

<ax:layout name="base">
	...
</ax:layout>

---

row

악수 그리드 시스템을 사용하기 위한 row tag입니다.

attributes

• id tag의 id입니다. 기본값은 자동으로 생성됩니다.
• css tag에 추가될 class 입니다.
• style tag에 추가될 style 입니다.

example

<ax:row>
	<ax:col size="12">
		...
	</ax:col>
</ax:row>

---

col

악수 그리드 시스템을 사용하기 위한 col tag입니다. 하나의 row tag 안에 col tag size의 합은 12가 되어야 합니다.

attributes

• id tag의 id입니다. 기본값은 자동으로 생성됩니다.
• size 가로 길이를 의미하며 1 ~ 12 까지 지정할 수 있습니다.
• css tag에 추가될 class 입니다.
• style tag에 추가될 style 입니다.

example

<ax:row>
	<ax:col size="4">
		...
	</ax:col>
	<ax:col size="8">
		...
	</ax:col>
</ax:row>

---

form

HTML form과 동일하며 form외에 레이아웃과 스타일적 요소를 추가적으로 가지고 있습니다.

attributes

• id tag의 id입니다. 기본값은 자동으로 생성됩니다.
• name HTML form의 name입니다. 기본값은 id값 입니다.
• method HTML form의 method입니다. 기본값은 POST값 입니다.
• action HTML form의 action입니다.
• css tag에 추가될 class 입니다.
• style tag에 추가될 style 입니다.

example

<ax:form name="table-form">
	...
</ax:form>

---

fields

form tag 내부에서 row의 역할을 하는 tag 입니다.

attributes

• id: tag의 id입니다. 기본값은 자동으로 생성됩니다.
• css: tag에 추가될 class 입니다.
• style: tag에 추가될 style 입니다.

example

<ax:form name="table-form">
	<ax:fields>
		...
	</ax:fields>
	<ax:fields>
		...
	</ax:fields>
</ax:form>

---

field

fields tag 내부에서 컬럼처럼 사용되는 tag입니다.

attributes

• id tag의 id입니다. 기본값은 자동으로 생성됩니다.
• label 입력 항목명 입니다.
• title 입력 항목에 대한 설명을 입력합니다. HTML title attribute입니다.
• css tag에 추가될 class 입니다.
• style tag에 추가될 style 입니다.

example

<ax:form name="table-form">
	<ax:fields>
		<ax:field label="번호">
			<input type="text" ... />
		</ax:field>
	</ax:fields>
	<ax:fields>
		<ax:field label="이메일">
			<input type="text" ... />
		</ax:field>
	</ax:fields>
</ax:form>

---