FrontPage > SAStrutsの覚書 > サンプルアプリ

検索画面から更新画面を呼び出す

検索画面の検索結果より更新画面へ遷移できるようにする。
また更新画面より検索画面へ戻ることができるようにする。
そのため、更新画面にも検索条件などの項目をhiddenタグで持たせる。

1. Actionフォーム

  • EmpConditionForm.java
    検索画面と更新画面で共通になる項目を切り出す。
    package com.ziqoo.sassample.form;
    import org.seasar.struts.annotation.DateType;
    import org.seasar.struts.annotation.IntegerType;
    
    public abstract class EmpConditionForm {
        /** 従業員番号 */
        @IntegerType
        public String empNoCondition;
    
        /** 従業員名 */
        public String empNameCondition;
    
        /** 雇用日最小日付 */
        @DateType(datePattern="yyyy/MM/dd")
        public String hiredateMin;
    
        /** 雇用日最大日付 */
        @DateType(datePattern="yyyy/MM/dd")
        public String hiredateMax;
    
        /** 部門ID */
        public String deptIdCondition;
    
        public long totalCount;
        public long totalPage;
        public long page;
        public String fromPageName;
    }
  • SearchEmpForm.java
    切り出したプロパティを削除し、EmpConditionFormを継承する。
    package com.ziqoo.sassample.form;
    
    import java.util.List;
    import com.ziqoo.sassample.dto.SearchEmpDto;
    import com.ziqoo.sassample.entity.Dept;
    
    public class SearchEmpForm extends EmpConditionForm{
    
       /** 部門選択リスト */
       public List<Dept> deptList;
    
       /** 従業員検索結果 */
       public List<SearchEmpDto> empList;
    }
  • EditEmpForm.java
    EmpConditionFormを継承するよう修正する。
    package com.ziqoo.sassample.form;
    
    import java.util.List;
    import org.seasar.struts.annotation.DateType;
    import org.seasar.struts.annotation.FloatRange;
    import org.seasar.struts.annotation.IntRange;
    import org.seasar.struts.annotation.Mask;
    import org.seasar.struts.annotation.Required;
    import com.ziqoo.sassample.entity.Dept;
    
    public class EditEmpForm extends EmpConditionForm{
    
       public Long id;
    
       @Required
       @IntRange(min=0, max=Integer.MAX_VALUE)
       public String empNo;
    
       @Mask(mask="^\\w+$")
       public String empName;
    
       @IntRange(min=0, max=Integer.MAX_VALUE)
       public String mgrId;
    
       @DateType(datePattern="yyyy/MM/dd")
       public String hiredate;
    
       @FloatRange(min="0", max="99999.99")
       public String sal;
    
       public Integer deptId;
    
       public Integer versionNo;
    
       /** 部門選択リスト */
       public List<Dept> deptList;
    }

2. Actionクラス

  • SearchEmpAction.java
    package com.ziqoo.sassample.action;
    
    import javax.annotation.Resource;
    import org.apache.commons.logging.Log;
    import org.apache.commons.logging.LogFactory;
    import org.seasar.framework.beans.util.Beans;
    import org.seasar.struts.annotation.ActionForm;
    import org.seasar.struts.annotation.Execute;
    import com.ziqoo.sassample.condition.PageCondition;
    import com.ziqoo.sassample.condition.SearchEmpCondition;
    import com.ziqoo.sassample.form.SearchEmpForm;
    import com.ziqoo.sassample.service.DeptService;
    import com.ziqoo.sassample.service.EmpService;
    import com.ziqoo.sassample.util.PropertiesUtil;
    
    public class SearchEmpAction {
    
       @Resource
       protected DeptService deptService;
       @Resource
       protected EmpService empService;
    
       @Resource
       @ActionForm
       protected SearchEmpForm searchEmpForm;
    
       @Resource
       protected PropertiesUtil propUtil;
    
       /**
        * 検索画面表示
        * @return
        */
       @Execute(validator=false)
       public String index() {
           searchEmpForm.totalCount = 0;
           searchEmpForm.totalPage = 0;
           searchEmpForm.page = 0;
    
           // 部門選択リスト作成
           searchEmpForm.deptList = deptService.findAllOrderById();
    
           return "searchEmp.jsp";
       }
    
       /**
        * 従業員検索
        * @return
        */
       @Execute(validator=true, input="index")
       public String search() {
           searchEmp(1);
           return "searchEmp.jsp";
       }
    
       /**
        * 次ページ
        * @return
        */
       @Execute(validator=true, input="index")
       public String nextPage() {
           searchEmp(searchEmpForm.page + 1);
           return "searchEmp.jsp";
       }
    
       /**
        * 前ページ
        * @return
        */
       @Execute(validator=true, input="index")
       public String prevPage() {
           searchEmp(searchEmpForm.page - 1);
           return "searchEmp.jsp";
       }
    
       /**
        * 検索画面に戻る
        * @return
        */
       @Execute(validator=false)
       public String comeBack() {
           searchEmp(searchEmpForm.page);
           return "searchEmp.jsp";
       }
    
       private void searchEmp(long page) {
           // 部門選択リスト作成
           searchEmpForm.deptList = deptService.findAllOrderById();
    
           // 検索条件コピー
           SearchEmpCondition condition = Beans.createAndCopy(SearchEmpCondition.class, searchEmpForm).execute();
    
           PageCondition pageCondition = new PageCondition();
           pageCondition.limitCount = propUtil.getInt("searchEmp.limitCount");
           pageCondition.page = page;
    
           // 従業員検索
           searchEmpForm.empList = empService.find(condition, pageCondition);
    
           searchEmpForm.totalCount = pageCondition.getTotalCount();
           searchEmpForm.totalPage = pageCondition.getTotalPage();
           searchEmpForm.page = pageCondition.page;
    
       }
    }

3. jsp

  • searchEmp.jsp
    <%@page language="java" contentType="text/html; charset=UTF-8"  pageEncoding="UTF-8"%>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
    <title></title>
    <link rel="stylesheet" type="text/css" href="${f:url('/css/stylesheet.css')}">
    <script type="text/javascript">
    <!--
    var tController;
    function init() {
       var dataHeader = document.getElementById("dataHeader");
       var dataBody = document.getElementById("dataBody");
    
       tController = new TableController(dataHeader, dataBody, 512, 170, 380);
    
       addEvent(window, "resize", tController.resize);
       addEvent(window, "resize", tController.scrollH);
       addEvent(dataBody, "scroll", tController.scrollH);
       tController.resize();
    }
    function TableController(dataHeader, dataBody, maxWidth, gapHorizontal, gapVertical) {
       this.resize = function(){
           dataBody.style.height = Math.max(50,document.body.clientHeight-gapVertical);
    
           var width = Math.max(50, document.body.clientWidth - gapHorizontal);
           if (width > maxWidth) {
               dataHeader.style.width = maxWidth;
               dataBody.style.width = maxWidth;
           } else {
               dataHeader.style.width = width;
               dataBody.style.width = width;
           }
       };
    
       this.scrollH = function() {
           dataHeader.scrollLeft = dataBody.scrollLeft;
       };
    }
    
    function addEvent(elem, eventName, func) {
       if (elem.attachEvent) {
           elem.attachEvent('on' + eventName, func);
       } else if (elem.addEventListener) {
           elem.addEventListener(eventName, func, false);
       }
    }
    function edit(frm, id) {
       var empId = document.getElementById("empId");
       empId.value = id;
       var fromPageName = document.getElementById("fromPageName");
       fromPageName.value = "searchEmp";
       frm.action = '${f:url("/editEmp")}';
       frm.submit();
    }
    //-->
    </script>
    <style type="text/css">
    <!--
    .col0 {width: 55px;}
    .col1 {width: 100px;}
    .col2 {width: 100px;}
    .col3 {width: 100px; text-align: center;}
    .col4 {width:139px;}
    -->
    </style>
    </head>
    <body onload="init()">
    <tiles:insert template="/WEB-INF/view/common/layout.jsp" flush="true">
    <tiles:put name="content_menu" type="string">
    </tiles:put>
    <tiles:put name="content" type="string">
    <div class="content">
       <html:errors/>
       <s:form method="POST" styleId="form1">
           <table class="data" style="width:500px;">
           <tr>
               <th class="data" style="width: 100px;">従業員番号</th>
               <td class="data" style="width: 110px;">
                   <html:text property="empNoCondition" size="12" maxlength="10" errorStyleClass="error"/></td>
               <th class="data" style="width: 100px;">従業員名</th>
               <td class="data">
                   <html:text property="empNameCondition" size="22" maxlength="20"/></td>
           </tr>
           <tr>
               <th class="data">雇用日</th>
               <td class="data" colspan="3">
                   <html:text property="hiredateMin" size="12" maxlength="10" errorStyleClass="error"/> 〜
                   <html:text property="hiredateMax" size="12" maxlength="10" errorStyleClass="error"/>(yyyy/mm/dd)
               </td>
           </tr>
           <tr>
               <th class="data">部門名</th>
               <td class="data" colspan="3">
                   <html:select property="deptIdCondition">
                       <option value=""></option>
                       <html:options collection="deptList" property="id" labelProperty="deptName"/>
                   </html:select>
               </td>
           </tr>
           </table>
           <s:submit property="search" value="検索"/>
           <br><br>
           全${totalCount}件 <s:submit property="prevPage" value="<" disabled="${page <= 1 }"/>
           【${page}<html:hidden property="page"/>/${totalPage}ページ】
           <s:submit property="nextPage" value=">" disabled="${page == totalPage }"/>
           <div id="dataHeader"  class="dataHeader">
               <table class="data" style="width:550px; background-color: transparent; margin: 0px;">
                   <tr>
                   <th class="data col0"></th>
                   <th class="data col1">従業員番号</th>
                   <th class="data col2">従業員名</th>
                   <th class="data col3">雇用日</th>
                   <th class="data col4">部門名</th>
                   <td ></td>
                   </tr>
               </table>
           </div>
           <div id="dataBody"  class="dataBody">
               <table class="data" style="width:440px; margin: 0px;">
                   <c:forEach var="emp" items="${empList}">
                       <tr>
                           <td class="data col0">
                               <input type="button" value="編集" onclick='edit(this.form, "${emp.Id}")'/>
                           </td>
                           <td class="data col1">${emp.empNo}</td>
                           <td class="data col2">${f:h(emp.empName)}</td>
                           <td class="data col3">
                               <fmt:formatDate value="${emp.hireDate}" pattern="yyyy/MM/dd"/></td>
                           <td class="data col4">${emp.deptName}</td>
                       </tr>
                   </c:forEach>
               </table>
           </div>
           <html:hidden property="id" value="" styleId="empId"/>
           <html:hidden property="fromPageName" value="" styleId="fromPageName"/>
       </s:form>
    </div>
    </tiles:put>
    </tiles:insert>
    </body>
    </html>
  • editEmp.jsp
    <%@page language="java" contentType="text/html; charset=UTF-8"  pageEncoding="UTF-8"%>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title></title>
    <link rel="stylesheet" type="text/css" href="${f:url('/css/stylesheet.css')}">
    <script type="text/javascript">
    <!--
    function add(btn, frm) {
       btn.disabled = true;
       frm.action += "add";
       frm.submit();
    }
    function goBack(frm) {
       frm.action = '${f:url("/searchEmp/comeBack")}';
       frm.submit();
    }
    //-->
    </script>
    </head>
    <body>
    <s:form method="POST" styleId="form1">
    <tiles:insert template="/WEB-INF/view/common/layout.jsp" flush="true">
    <tiles:put name="content_menu" type="string">
       <c:choose>
           <c:when test="${id == null}">
               <input type="button" onclick="add(this, this.form)" value="登録"/>
           </c:when>
           <c:otherwise>
               <s:submit property="update" value="更新"/>
           </c:otherwise>
       </c:choose>
       <c:if test='${fromPageName == "searchEmp" }'>
           <input type="button" onclick="goBack(this.form)" value="戻る"/>
       </c:if>
    </tiles:put>
    <tiles:put name="content" type="string">
    <div id="content" class="content_scroll">
       <html:errors/>
           <table class="data" style="width:300px;">
           <tr>
               <th class="data" style="width: 100px;">ID</th>
               <td class="data" style="width:150px;">
               ${id}<html:hidden property="id"/><html:hidden property="versionNo"/>
               </td>
           </tr>
           <tr>
               <th class="data">従業員番号</th>
               <td class="data">
                   <html:text property="empNo" size="12" maxlength="10" errorStyleClass="error"/></td>
           </tr>
           <tr>
               <th class="data">従業員名</th>
               <td class="data">
                   <html:text property="empName" size="26" maxlength="20" errorStyleClass="error"/></td>
           </tr>
           <tr>
               <th class="data">雇用日</th>
               <td class="data">
                   <html:text property="hiredate" size="12" maxlength="10" errorStyleClass="error"/>
               </td>
           </tr>
           <tr>
               <th class="data">給与</th>
               <td class="data">
                   <html:text property="sal" size="10" maxlength="8" errorStyleClass="error"/>
               </td>
           </tr>
           <tr>
               <th class="data">管理者ID</th>
               <td class="data">
                   <html:text property="mgrId" size="12" maxlength="10" errorStyleClass="error"/>
               </td>
           </tr>
           <tr>
               <th class="data">部門名</th>
               <td class="data">
                   <html:select property="deptId">
                       <option value=""></option>
                       <html:options collection="deptList" property="id" labelProperty="deptName"/>
                   </html:select>
               </td>
           </tr>
           </table>
           <html:hidden property="versionNo"/>
    </div>
    <html:hidden property="empNoCondition"/>
    <html:hidden property="empNameCondition"/>
    <html:hidden property="hiredateMin"/>
    <html:hidden property="hiredateMax"/>
    <html:hidden property="deptIdCondition"/>
    <html:hidden property="page"/>
    <html:hidden property="fromPageName"/>
    </tiles:put>
    </tiles:insert>
    </s:form>
    </body>
    </html>

4. 実行結果

sassample09.jpg
sassample10.jpg





添付ファイル: filesassample10.jpg 578件 [詳細] filesassample09.jpg 584件 [詳細]

トップ   編集 凍結解除 差分 バックアップ 添付 複製 名前変更 リロード   新規 一覧 単語検索 最終更新   ヘルプ   最終更新のRSS
Last-modified: 2012-01-21 (土) 23:49:25 (2733d)