JSPへ配列を渡して表示する方法

ヘッダー広告
スポンサードリンク

先日同じ会社の2年目の方が書いているJavaアプリケーションのコードを見ていたところ、サーブレット側で作成した結果をJSPで表示する処理の中で、配列(List)を使わずに必要な数のパラメータを作成して表示させていました。
件数が少ないのであれば問題ないのですが、コードとして少しカッコ悪く、今後増えた場合にも修正が大変だと思います。
そこで今回は配列(List)データをサーブレット側で作成・パラメータを渡して、JSP側で表示する方法について試したいと思います。

JSPへ配列を渡して表示する方法

今回のアプリケーションの説明

今回ご紹介するコードは、名前と住所を入力し、それに合致するデータをDBから取得して表示させるというものです。
ただし、今回はDBの部分は省略させていただき、3人の適当な名前と選択した住所をデータ化し、画面上に表示させるというものになります。
DBから取得する場合はサーブレット側を変更いただければ、データの増減はJSPに影響しないため、修正せずに対応可能です。

JSP側の記述

早速JSP側の記述になりますが、JSPではパラメータを取得し、JavaBeansオブジェクトにセットします。
その後データ数分ループさせて値を表示させていくという記載になります。
簡単でシンプルな処理になります。

※汚いHTMLですがお許しください。

<%@ page language="java" contentType="text/html;charset=Windows-31J" %>
<%@ page pageEncoding="Windows-31J" %>
<%@ page import="java.util.*" %>
<%@ page import="Beans.*" %>

<HTML>

<HEAD>

	<TITLE>Beans確認</TITLE>

	<style type="text/css">
		.block1 {
			display: inline-block;
			width: 4em
		}
		.block2 {
			display: inline-block;
			width: 7em
		}
	</style>

</HEAD>

<BODY>

	<h1>Beans確認</h1>

	<form Action="SearchServlet" method="post">
		名前:<input type="text" name ="userName" /><br>
		<span class="block1">住所:</span><input type="radio" name="Address" value="Tokyo" />東京<br>
		<span class="block1"></span><input type="radio" name="Address" value="Chiba" />千葉<br>
		<span class="block1"></span><input type="radio" name="Address" value="Kanagawa" />神奈川<br>
		<input type="submit" name="submit" value="POST送信" />
	</form>

    <p style="margin-top:2.0em;"></p>

	<%

		List<BaseBean> listBase = (List<BaseBean>)request.getAttribute("listBase");

		if (listBase != null) {

			for (int i = 0; i < listBase.size(); i++) {

				BaseBean bean = (BaseBean)listBase.get(i);

				out.println("<span class=\"block2\">ユーザー名:</span>" + bean.getUserName() + "<br>");
				out.println("<span class=\"block2\">住所:</span>" + bean.getAddress() + "<br>");

			}
		}

	%>


</BODY>

</HTML>

ビジネスロジック側の記述

ビジネスロジック側では、JSPへ渡すリクエストパラメータを作成します。
今回は省略していますが、DBから値を取得する処理もここに記載します。
パラメータを作成後は、ディスパッチャーを使用し、先ほどのBeanCheck.jspへフォワードさせて結果データを表示させます。

package beancheck;

import java.io.IOException;
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;

import javax.servlet.RequestDispatcher;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import Beans.BaseBean;


public class SearchServlet extends HttpServlet {
	protected void doPost( HttpServletRequest req, HttpServletResponse res )
							 throws ServletException, IOException{

		/*
		 * DB取得処理

		String userName = req.getParameter("userName");

		 * ここにDB取得処理を記載する。
		*/

		String Address = req.getParameter("Address");

		HashMap<String, String> Base = new HashMap<String,String>();

		Base.put("TaroSato", Address);
		Base.put("HanakoYamada", Address);
		Base.put("IchiroSuzuki", Address);

		List<BaseBean> listBase = new ArrayList<BaseBean>();

		for (String key : Base.keySet()) {
			BaseBean bean = new BaseBean();

			bean.setUserName(key);
			bean.setAddress(Base.get(key));

			listBase.add(bean);

		}

		req.setAttribute("listBase", listBase);

		RequestDispatcher dispatch = req.getRequestDispatcher("./BeanCheck.jsp");

		dispatch.forward(req, res);
	}
}

JavaBeanSの記述

最後にJavaBeansを作成します。
今回のデータは、ユーザー名と住所だけなので、以下のようなコードになります。

package Beans;

public class BaseBean {

	private String userName;
	private String Address;

	//UserNameセッター
	public void setUserName(String userName) {
		this.userName = userName;
	}
	//UserNameゲッター
	public String getUserName() {
		return this.userName;
	}

	//Addressセッター
	public void setAddress(String Address) {
		this.Address = Address;

	}
	//Addressゲッター
	public String getAddress() {
		return this.Address;
	}


}

処理結果

データ取得前の画面表示

上記のコードを実際の画面で確認するとどうなるか。

まずデータ取得前の初期表示状態はこのような画面になります。


名前を入力できる欄と、住所を選択できるプルダウンが表示されている状態です。
この住所を選択して、Post送信をクリックします。

データ取得後の画面表示

実行後の画面はこのようになります。


取得したデータが画面上に表示されることが確認できます。
もしデータが増えた場合も、データ数分表示されるため、表でデータを表示させたい場合なども使うことが出来ます。

JSPで配列を表示する方法をお伝えしました。
まだまだJavaは勉強中なので、下手なコードではありますがご参考にしてください。
ちなみにjsp:useBean タグをすることでも値を取得できますが、今回は省略させていただきました。

フッター広告

スポンサードリンク



シェアする

  • このエントリーをはてなブックマークに追加

フォローする