Whiteship's Note


[회사일] new.jsp 태그파일 적용

프로젝트/SLT : 2010.06.14 11:54


code/new.jsp

<page:newpage label="새 코드">
    <f:select label="코드종류" path="cate" items="${ref.codeCateList}" />
    <f:input label="코드값" path="code" />
    <f:input label="코드명" path="name" />
    <f:textarea label="설명" path="descr" />
</page:newpage>

member/new.jsp

<page:newpage label="새 계정">
    <f:input label="로그인 ID" path="loginId"/>
    <f:input label="비밀번호" path="password"/>
    <f:input label="이름" path="name"/>
    <f:input label="이메일" path="email"/>
</page:newpage>



new.jsp 페이지는 edit.jsp랑 비슷했으니까 간단간단 이제 view.jsp 페이지만 남았군요.
top


[회사일] mgt.jsp 파일에 태그 파일 적용

프로젝트/SLT : 2010.06.14 11:38



가운데는 그리드가 와야하고 오른쪽에는 검색 화면이 나와야하는 페이지. 이 페이지에 태그 파일을 적용해서...

<page:mgtpage label="계정 관리">
    <page:search label="계정 검색">
        <s:input label="이름" path="name" />
        <s:input label="이메일" path="email" />
    </page:search>
    <script type="text/javascript">
        $(function() {
            $("#smdis-grid").jqGrid({
                colNames:['id', '아이디', '이름', '이메일'],
                colModel :[
                    {name:'id', index:'id', width:55, hidden:true},
                    {name:'loginId', index:'loginId', width:80},
                    {name:'name', index:'name', width:90},
                    {name:'email', index:'email', width:90},
                ]
            });
        });
    </script>
</page:mgtpage>

이런식으로 만들었습니다. 딱 봐도.. 검색 부분에 머머가 있구나.. 그리드에는 머머가 있구나가 보이니깐 이정도면 만족합니다. 태그 파일을 계속 써보니까 그 장점 중 하나가 태그에 좀 더 의미있는 이름을 줄 수 있다는 것이 있더라구요. 대신 단점으로는 이 태그 파일만 가지고 테스트 할 수 없다는게 좀 안타깝습니다. 계속해서 서버를 띄워둔 상태에서 릴로딩 해가면서 확인하고 있는데.. 아마 프리마커 같은 템플릿 엔진의 장점은 바로 테스트 용이성이 아닐까 싶습니다.

머 어쨋든 지금은 일단 JSP + 태그파일로 후딱 만들기로 했습니다. 
나중에 프리마커 + 매크로를 사용해서 대체해보는 방법도 생각해볼 수 있겠지만.. 머 나중에;

태그 파일을 분류해서 page는 페이지 구조와 관련된 태그를 만들고..
s는 검색에 사용할 폼 태그들을 만들고..
f는 수정이나 추가할 때 사용할 폼 태그들을 만들기로 했습니다.
 
top


[회사일] edit.jsp 화면에 태그 파일 적용하기

프로젝트/SLT : 2010.06.11 14:05


먼저 Code 도메인의 edit.jsp 코드를 보겠습니다.

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ taglib prefix="page" tagdir="/WEB-INF/tags/page" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>

<page:page>
    <page:head/>
    <page:body>
        <div class="ui-layout-center">
            <h2 class="smdis-pane-title" id="smdis-grid-title">
                <ul class="smdis-left-icons">
                    <li id="smdis-save-button" class="ui-state-default ui-corner-all" title="저장"><span class="ui-icon ui-icon-disk"></span></li>
                    <li id="smdis-delete-button" class="ui-state-default ui-corner-all" title="삭제"><span class="ui-icon ui-icon-trash"></span></li>
                    <li id="smdis-reload-button" class="ui-state-default ui-corner-all" title="원래값으로"><span class="ui-icon ui-icon-refresh"></span></li>
                </ul>
                <ul class="smdis-right-icons">
                    <li id="smdis-list-button" class="ui-state-default ui-corner-all" title="목록으로"><span class="ui-icon ui-icon-search"></span></li>
                    <li id="smdis-back-button" class="ui-state-default ui-corner-all" title="뒤로"><span class="ui-icon ui-icon-arrowreturnthick-1-w"></span></li>
                </ul>
                코드 수정
            </h2>
            <form:form commandName="model" action="/base/code/${model.id}" method="PUT">
                <p class="ui-widget-content"><label>코드종류</label><form:select path="cate" items="${ref.codeCateList}" itemValue="value" itemLabel="descr" /><form:errors path="cate" cssClass="smdis-error-message"/></p>
                <p class="ui-widget-content"><label>코드값</label><form:input path="code"/><form:errors path="code" cssClass="smdis-error-message"/></p>
                <p class="ui-widget-content"><label>코드명</label><form:input path="name"/><form:errors path="name" cssClass="smdis-error-message"/></p>
                <p class="ui-widget-content"><label>설명</label><form:textarea path="descr"/></p>
            </form:form>
        </div>

        <%--//검색/정렬--%>
        <div class="ui-layout-east">
            <h2 class="smdis-pane-title">
                <ul class="smdis-left-icons">
                    <li id="smdis-grid-apply" class="ui-state-default ui-corner-all" title="적용"><span class="ui-icon ui-icon-arrowthickstop-1-w"></span></li>
                </ul>
                <ul class="smdis-right-icons">
                    <li class="ui-state-default ui-corner-all" title="적용하고 닫기"><span class="ui-icon ui-icon-arrowthickstop-1-e"></span></li>
                </ul>
                검색
            </h2>
        </div>

    <script type="text/javascript">
        $(function() {
            $("button").button();

            $("#smdis-save-button").click(function(){
                var result = confirm("저장 하시겠습니까?");
                if(!result) return;

                $("form input[name='_method']").attr("value", "PUT");
                $("form").submit();
            });

            $("#smdis-delete-button").click(function(){
                var result = confirm("삭제 하시겠습니까?");
                if(!result) return;
                
                $("form input[name='_method']").attr("value", "DELETE");
                $("form").submit();
            });

            $("#smdis-reload-button").click(function(){
                var result = confirm("변경 사항을 취소 하시겠습니까?");
                if(!result) return;

                $(document).attr("location", '/base/code/${model.id}/form');
            });

            $("#smdis-back-button").click(function(){
                $(document).attr("location", '/base/code/${model.id}');
            });

            $("#smdis-list-button").click(function(){
                $(document).attr("location", '/base/code/mgt');    
            });
        });
    </script>
    </page:body>
</page:page>

일부는 page라는 태그파일을 적용해서 코드를 많이 줄여놨습니다. 그래도 너무 길고.. Member의 edit.jsp 파일을 만들 때 손대는 곳은 굵은 글씨 밖에 없습니다. 신경쓸 곳만 신경쓰게 만들고 나머진 신경쓰고 싶지도 않고 보고 싶지도 않습니다. 그리고 위와 같은 코드가 여러 JSP에 중복되면.. 결국 자바 중복 코드랑 다를께 없습니다. 화면 코드에서도 중복을 제거해야 합니다.

Member 도메인의 edit.jsp 파일은 결국 다음과 같이 바꼈습니다.

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ taglib prefix="page" tagdir="/WEB-INF/tags/page" %>
<%@ taglib prefix="osaf" tagdir="/WEB-INF/tags/osaf" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>

<page:page>
    <page:head/>
    <page:body>
        <page:edit label="계정 수정">
            <osaf:input label="로그인ID" path="loginId"/>
            <osaf:input label="비밀번호" path="password"/>
            <osaf:input label="이름" path="name"/>
            <osaf:input label="이메일" path="email"/>
        </page:edit>
        <page:searchWithoutButtons />
    </page:body>
</page:page>

정말 이게 전부입니다. 잡습 코드도 잡습이 적용될 코드가 들어있는 태그 파일로 넣어놨습니다. Code의 edit.jsp 파일에도 태그 파일을 적용하면..

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ taglib prefix="page" tagdir="/WEB-INF/tags/page" %>
<%@ taglib prefix="osaf" tagdir="/WEB-INF/tags/osaf" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>

<page:page>
    <page:head/>
    <page:body>
        <page:edit label="코드 수정">
            <osaf:select label="코드종류" path="cate" items="${ref.codeCateList}" itemValue="value" itemLabel="descr" />
            <osaf:input label="코드값" path="code"/>
            <osaf:input label="코드명" path="name"/>
            <osaf:textarea label="설명" path="descr"/>
        </page:edit>
        <page:searchWithoutButtons />
    </page:body>
</page:page>

이렇게 됩니다. 사실 저기서 위아래 세줄 정도도 관심 대상이 아니라서 page:editpage 같은 태그 파일을 만들어 줄일 수도 있습니다.

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ taglib prefix="page" tagdir="/WEB-INF/tags/page" %>
<%@ taglib prefix="osaf" tagdir="/WEB-INF/tags/osaf" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>

<page:editpage label="코드 수정">
    <osaf:select label="코드종류" path="cate" items="${ref.codeCateList}" itemValue="value" itemLabel="descr" />
    <osaf:input label="코드값" path="code"/>
    <osaf:input label="코드명" path="name"/>
    <osaf:textarea label="설명" path="descr"/>
</page:editpage>

좋아 좋아!!! 이제부터는 이렇게 딱 다섯줄만 코딩하면...


이런 화면을 만들 수 있는 겁니다.

이대로 끝내면 아쉬우니까 태그파일 코드 몇개만 공개하겠습니다.

WEB-INF/tags/page/editpage.tag

<%@ tag pageEncoding="utf-8" %>
<%@ taglib prefix="page" tagdir="/WEB-INF/tags/page" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%@ attribute name="label" required="true"%>

<page:page>
    <page:head/>
    <page:body>
        <page:edit label="${label}">
            <jsp:doBody/>
        </page:edit>
        <page:searchWithoutButtons />
    </page:body>
</page:page>

WEB-INF/tags/osaf/select.tag

<%@ tag pageEncoding="utf-8" %>
<%@ taglib prefix="page" tagdir="/WEB-INF/tags/page" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%@ attribute name="label" required="true"%>
<%@ attribute name="path" required="true"%>
<%@ attribute name="items" type="java.util.List" required="true"%>
<%@ attribute name="itemValue" required="false"%>
<%@ attribute name="itemLabel" required="false"%>

<p class="ui-widget-content">
    <label>${label}</label>
    <form:select path="${path}" items="${items}" itemValue="${itemValue}" itemLabel="${itemLabel}" />
    <form:errors path="${path}" cssClass="smdis-error-message"/>
</p>
top


스프링 JSON view와 jQuery 이용하여 자동완성 기능 만들기 4

모하니?/Coding : 2009.07.14 18:35


마무리로 태그 파일화 작업을 했습니다.

             <o:textwithac label="이름" id="name" size="20" maxlength="30"
                 url="/ajax/user/names.do" model="users" width="200" selectFirst="true" />

이런 태그와..

<script type="text/javascript">
function formatItem(row, i, total){
    return row[1] + " " + row[2];
}
function formatResult(row){
    return row[1];
}
function result(event, row, formatted){
    if (row){
        $("#namedetail").text(row[0] + " " + row[2]);
    }
}
</script>

자바스크립트 함수 세 개로 자동완성 기능을 사용할 수 있습니다.

속성 중에서

url="/ajax/user/names.do" model="users" width="200" selectFirst="true"

이 녀석들이 자동완성과 관련된 속성들이며..

formatItem은 자동완성 목록을 어떤 형태로 보여줄지 코드를 작성해주면 되는데, 이 때 row는 현재 데이터 row이고, i는 인덱스, total은 총 갯수 입니다.

formatResult는 자동완성 목록에서 선택했을 때 text input 박스에 최종적으로 입력할 값을 return하도록 합니다.

마지막으로 result는 자동완성 목록을 선택했을 때 후 처리 이벤트 같은 것으로, result 타입의 이벤트와, 선택한 데이터 row, 그리고 formatResult에서 input 필드에 입력되도록 포맷팅한 값입니다. 이 녀석들을 이용해서 적당하게 코딩해주면 되겠습니다. 예제에서는 namedetila이라는 엘리먼트에 부가정보를 기입해주었습니다.



top


오늘 하루 타일즈(Tiles)에 낚였나보다~

Good Tools : 2009.05.01 19:46


성윤이랑 정말 신나게 가지고 놀았는데, 집에 갈 때 쯤이 다 되서 생각해 보건데..

매번 페이지를 추가할 때 마다 설정을 추가해야 한다는 건 정말 못 할 짓이다. 하루 종일 성윤이랑 씨름하며 개발중인 봄싹 사이트에 적용해 보았다.

못 할 짓이다.

안그래도 하면서 성윤이한테 이런 얘길 했었다.

    <!-- main page  -->
    <definition name="index" extends=".root">
        <put-attribute name="content" value="/jsp/index.jsp" />
    </definition>

    <definition name="login" extends=".root">
        <put-attribute name="content" value="/jsp/login/login.jsp" />
    </definition>

    <!-- member page  -->
    <definition name="member/list" extends=".root">
        <put-attribute name="content" value="/jsp/member/list.jsp" />
    </definition>

    <definition name="member/add" extends=".empty">
        <put-attribute name="content" value="/jsp/member/add.jsp" />
    </definition>

    <definition name="member/view" extends=".empty">
        <put-attribute name="content" value="/jsp/member/view.jsp" />
    </definition>

    <definition name="member/update" extends=".empty">
        <put-attribute name="content" value="/jsp/member/update.jsp" />
    </definition>

이런 식으로 계속 설정하는 건 정말 안 되겠다 싶어서, definition의 name 속성에 넣는 값이랑 put-attrubute의 value 속성에 넣는 값들이 비슷해 보이니까 저런걸 CoC 적용해서 자동으로 할 수 있게 패치를 만들어 볼까? 하는 얘길했었다.


그러나...


못 할 짓이고, 안 해도 될 것 같다. 하루 종일 공부했는데 허탈한 기분이 들지만..

사부님이 such is life 란다. ㅋㅋ

내일은 태그파일을 적용해봐야겠다.


top


태그 파일에서 객체 노출시키기

View/JSP : 2008.10.14 13:27


태그 파일에 어떤 객체를 전달하는게 아니라, 그 반대로 태그 파일에서 어떤 객체를 외부로 노출 시킬 수 있습니다. 태그 파일을 사용하고 있는 쪽에서 태그 파일이 가지고 있는 어떤 값에 접근하고자 할 때 유용하게 사용할 수 있겠습니다. jspContext를 사용하여 원하는 객체를 원하는 이름으로 저장해두면 됩니다.

상위 태그 파일

gridpage.tag

<%@ variable name-given="startNum" %>

<%
jspContext.setAttribute("startNum", count);
%>

JSP 파일

grid.jsp
<o:gridpage>
   ${startNum}
</o:gridpage>


top


items를 사용하는 태그 파일 꺄오~

View/JSP : 2008.09.19 19:17


태그 파일 만드는데 무슨 설계가 필요할까? 생각을 하자면, 한 없이 생각할 것이 많을 수 있습니다. 어떤 속성들을 받을 것인가? 속성 타입은 그냥 문자열로 할까 아니면 특정 타입으로 받을까? 태그 파일 코드 중복을 어떻게 제거할까? EL안에 EL을 쓸까? 덩덩덩...

오늘 고민한 건 저 중에서도 어떤 속성과 그 속성에 넘겨줄 값은 무슨 타입인가?에 대한 겁니다. 좀 더 구체적으로 HTML radio, checkbox, select 에 대응하는 태그 파일을 만들 때, items라는 속성에 어떤 값을 넘겨줄지에 대한 고민을 했습니다.

이런 경우가 있겠죠. 취미를 입력받아야 하는데, 예시로 몇개를 제공하고 그 중에서 선택할 수 있게 하려고 합니다. 그럼 화면에 참조할 데이터를 전달해야 합니다. 이 데이터가 최종적으로 items에 설정될 값이죠. 따라서 어떤 값을 넘겨줄 수 있는지 고민을 해야 합니다. 여러 형태로 참조 데이터를 넘겨줄 수 있겠지만, 일단 세 종류로 간추렸습니다.

1. Entity Type Collection

public List<Hobby> getHobbyType{
    return hobbyDao.getAll();
}

public class Member {
    Hobby hobby;
}

Entity 타입의 경우 화면에 보여줄 값을 가지고 있는 변수(textpath)와 실제 값을 가지고 있는 변수(valuepath)가 모두 엔티티의 속성입니다. 그리고 이 변수 이름은 각각의 엔티티에 따라 변할 수 있죠. 따라서 태그 파일에 valuepath와 textpath를 추가하고, 최종적으론 EL의 EL을 사용해서 값을 가져오면 됩니다.

2. Value Type Collection

public List<String> getHobbyType{
  return Arrays.asList("coding", "music", "movie");
}

public class Member{
  String hobby;
}

이 경우는 1번에 비해 매우 간단한데, 일단 차이는 textpath와 valuepath가 콜렉션에 들어있는 값이고, 이 값을 그대로 엔티티에 값으로 설정하면 되며, 일단, 스프링의 form 태그를 활용하면 정말 간단하게 태그 파일을 구현할 수 있습니다.

3. AbstractType's 하위클래스

public HobbyType getHobbyType{
  return HobbyType.getInstance();
}

public class Member {
    int hobby;
}

이 경우는 특수한 경우로, 프레임워크에서 별도의 enum 지원 클래스를 만들었을 때에 해당합니다. 특히 저 코드는 OSAF의 AbstractType을 사용한 경우로, 이 클래스에 대해서는 나중에 자세히 설명할 기회가 있을 것 같아서 자세한 설명은 미루겠습니다. 기본적으로 AbstractType 클래스는 ArrayList 타입입니다. 결국은 1번과 같은 것 아니냐?.. 아닙니다. key, value를 가지고 있는 Pair 타입의 콜렉션이기 때문에, 고정적인 valuepath와 textpath를 가지고 있습니다. 따라서 태그파일에서 컨벤션으로 실제 값과 화면에 보여줄 값을 가져다 보여줄 수 있습니다.

이 세 가지 경우를 모두 고려해서 만들어야 하는 태그 파일들은..

fselect.tag
fradiobuttons.tag
fcheckboxes.tag

Coming Soon...with OSAF!!

ps: 이밖에도 경우수는 더 많습니다. Map, 배열, enum.. 이것들까지 지원할 수 있는 태그를 완성하면.. 짱먹는 폼 태그가 되는거죠. 캬~

top


태그 파일 중복 제거 예제

View/JSP : 2008.09.17 14:08


스프링 form태그를 이용해서 태그 파일 두 개를 만들었습니다. 하나는 일반 text, 하나는 password입니다.

osaf/ftext.tag
<%@ tag pageEncoding="euc-kr" %>

<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>

<%@ attribute name="path" required="true" %>
<%@ attribute name="label" required="false" %>
<%@ attribute name="size" required="true" %>
<%@ attribute name="maxlength" required="true" %>
<%@ attribute name="desc" required="false" %>

<p id="${path}row">
    <label>${label} :</label>
    <form:input path="${path}" size="${size}" maxlength="${maxlength}"  />
    &nbsp;${desc}
    <form:errors path="${path}" cssClass="error" />
</p>

osaf/fpassword.tag
<%@ tag pageEncoding="euc-kr" %>

<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>

<%@ attribute name="path" required="true" %>
<%@ attribute name="label" required="false" %>
<%@ attribute name="size" required="true" %>
<%@ attribute name="maxlength" required="true" %>
<%@ attribute name="desc" required="false" %>

<p id="${path}row">
    <label>${label} :</label>
    <form:password path="${path}" size="${size}" maxlength="${maxlength}"  />
    &nbsp;${desc}
    <form:errors path="${path}" cssClass="error" />
</p>

코드가 완전 똑같아 보입니다. 무슨 틀린그림 찾기도 아닌데, 차이를 발견하기가 힘듭니다. 어쩔까~~ 내비둘까.. 계속 다른 태그 만들까.. 중복을 제거하고 갈까.. 하다가. TDD 책이 생각났습니다.

꺠진 테스트 -> 코딩 -> 녹색 -> 리팩터링.

태그 파일도 이런 순으로 만들고 있습니다. 일단 뷰부터 만들고(저 태그를 사용하는 JSP 페이지부터 만들고) -> 태그를 작성합니다. -> 화면에 나오는지 확인!..

아무래도 리팩터링을 하고 넘어가야될 듯 합니다. 어떻게 할까.. 대충 떠오릅니다. 저 태그에서 또 다른 태그를 이용해서 화면에 뿌리면되고, 그 태그에 type을 넘겨줘서 그 태그 안에서 분기문으로 ..샤샥.. 유사코드는 떠오르는데 실제 코드는 안 떠오릅니다. OTL 코드는 제 블로그 어딘가를 치팅해가면서;; ㅋ

osaf/felement.tag
<%@ tag pageEncoding="euc-kr" %>

<%@ taglib prefix="c" uri="http://java.sun.com/jstl/core_rt" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>

<%@ attribute name="path" required="true" %>
<%@ attribute name="label" required="false" %>
<%@ attribute name="size" required="true" %>
<%@ attribute name="maxlength" required="true" %>
<%@ attribute name="desc" required="false" %>
<%@ attribute name="type" required="true" %>

<p id="${path}row">
    <label>${label} :</label>
    <c:choose>
        <c:when test="${type =='text'}">
            <form:input path="${path}" size="${size}" maxlength="${maxlength}" />
        </c:when>
        <c:when test="${type =='password'}">
            <form:password path="${path}" size="${size}" maxlength="${maxlength}" />
        </c:when>
    </c:choose>
    &nbsp;${desc}
    <form:errors path="${path}" cssClass="error" />
</p>

좋아. 이 태그를 사용해서 확인해보니, 잘 동작합니다. 그럼 이제 기존의 코드들을 수정합니다.

osaf/ftext.tag
<%@ tag pageEncoding="euc-kr" %>
<%@ taglib prefix="o" tagdir="/WEB-INF/tags/osaf" %>

<%@ attribute name="path" required="true" %>
<%@ attribute name="label" required="false" %>
<%@ attribute name="size" required="true" %>
<%@ attribute name="maxlength" required="true" %>
<%@ attribute name="desc" required="false" %>

<o:felement type="text" label="${label}" path="${path}" maxlength="${maxlength}" size="${size}" desc="${desc}" />

osaf/fpassword.tag
<%@ tag pageEncoding="euc-kr" %>
<%@ taglib prefix="o" tagdir="/WEB-INF/tags/osaf" %>

<%@ attribute name="path" required="true" %>
<%@ attribute name="label" required="false" %>
<%@ attribute name="size" required="true" %>
<%@ attribute name="maxlength" required="true" %>
<%@ attribute name="desc" required="false" %>

<o:felement type="password" label="${label}" path="${path}" maxlength="${maxlength}" size="${size}" desc="${desc}" />

OK. 중복제거 완료 입니다. 덤으로 사용자에게 선택권이 생겼습니다. type 속성을 사용해가면서 felement를 직접 쓰거나, type 속성 쓸 필요 없이 ftext나 fpassword 엘리먼트 사용할 수 있습니다.
top


태그파일 멋쟁이!

모하니?/Coding : 2007.04.23 23:07


사용자 삽입 이미지
매우 쉬운 벨리데이션 js 파일을 사용해서 AJAX를 사용한 벨리데이션을 거의 날로 먹었습니다.

하지만 거의 날로 먹었다는 말을 괜히 한 것이 아니였습니다. JSP 코드가 다음과 같이 정신없어졌거든요.
사용자 삽입 이미지

그래서 태그파일을 만들기로 작심 했습니다. 그리고 만들었었습니다.
사용자 삽입 이미지

저런 저런...input의 type마다 태그를 하나씩 만들고야 말았습니다. spring form 태그들 중에 input엘리먼트에 type 속성이 없었기 때문에 저런 일이 발생했습니다.

하지만 다른 방법이 떠올랐습니다. type을 받아 오고 안에서 jstl로 그때 그때 적당한 spring form태그를 사용하도록 코딩하면 될 것 같았습니다. 그리고는 코딩에 들어갔습니다.
사용자 삽입 이미지

결과는 성공적이였습니다.

more..


태그파일을 적용한 JSP 코드는 이전보다 훨~씬 간단해 졌습니다.
사용자 삽입 이미지

태그파일 귿!!! 멋쟁이!! 태그파일 갈쳐주신 물개 선생님도 멋쟁이!!


top


ajn 태그 파일 table과 column

JEDI/ToDo : 2007.03.27 17:14


화면에서는 이렇게 사용할 수 있습니다.
    <ajn:table>
        <ajn:column title="순번" property="${order.num}" />
        <ajn:column title="책" property="${order.bookName}" link="${order.link}"/>
        <ajn:column title="신청자" property="${order.owners}" />
    </ajn:table>

table 태그의 내용은 다음과 같습니다.

more..

column 태그의 내용은 다음과 같습니다.

more..


유용하지 않은 이유는..
1. 저 태그를 사용하는 콜렉션의 이름은 무조건 orders 여야 합니다. 아니면 테이블 태그파일에서 리스트의 이름으로 빨간 색 부분을 수정해 주시면 됩니다.
2. 콜렉션에 담겨이는 각각의 객체에 있는 속성들은 꼭 앞에 order를 붙여줘야 합니다.

이렇게 된 이유는..
1. EL 안에 EL이 먹지 않습니다. ${order.${property}} 이런 건 안되더군요.
2. 머리가 나빠서..;; 아마 다른 방법이 있겠죠. displayTag 처럼 잘 돌아가는게 있으니까요.
top


list.jsp를 태그 파일 사용하여 개선하라.

JEDI/ToDo : 2007.03.23 13:47


일종의 API를 만드는 것으로 사용자가 무척 쉽게 사용할 수 있도록 설계를 해야 합니다.
참조 : 프레임워크의 인터페이스(API)

<ajn:page>
    <ajn:table>
       <ajn:thead>
          <ajn:th title="순번" />
          <ajn:th title="책" />
          <ajn:th title="신청자" />
       <ajn:thead>
       <ajn:tbody>
          <ajn:bookOrderColumn num="1", title="~~", link="~~", owners="~~" />
          <ajn:bookOrderColumn num="1", title="~~", link="~~", owners="~~" />
          <ajn:bookOrderColumn num="1", title="~~", link="~~", owners="~~" />
        </ajn:tbody>
    </ajn:table>
</ajn:page>

태그 파일 사용해서 코드 줄여 보겠다고 만든 원본이 위와 같았습니다. 태그가..page, table, thead, th, tbody, bookOrderColumn 무려 6개.. 기능이 엄청나게 많아서 어쩔 수 없이 복잡한 인터페이스라면 모를까... 기껏 해야 테이블하나 보여줄 뿐인데 말이죠.

<ajn:page title="구매 대행 신청 도서 목록">
    <ajn:table is="list" of="order">
        <ajn:column property="${order.num}" title="순번" />
        <ajn:column property="${order.bookName}" linkProperty="${order.link}" title="책이름"  />
        <ajn:column property="${order.owners}" title="신청자" />
    </ajn:table>
</ajn:page>

지금은 이렇게 바꼈습니다. 태그는 page, table, column 이렇게 세개로 줄었습니다. 대신 태그 파일들의 내부는 이전보다 복잡해 졌지만 그건 태그의 사용자가 고려할 사항이 아니죠.

ps : EL태그 안에 EL태그가 먹힌다면(ex. ${order.${property}})  개선한 코드에서 색칠된 부분을 뺄 수 있습니다.
top