Spring MVCでテキストボックスとセレクトボックスに入れた値を取得して表示するサンプル

この記事ではSpring MVCでテキストボックスに入れた値を取得する方法を紹介します。

プロジェクトを作成し、サンプルを動かし、ブラウザに表示させるまでやってみましょう。

プロジェクトの作成

New→Spring Project→Simple Spring web mavenでプロジェクトを作成する。
このとき、Mavenがインストールされてなかったらライブラリの依存が解決できなくてエラーが出るので注意が必要。

右クリック→Maven→Update Projectでプロジェクト全体をUpdateすることができる。

セレクトボックスとテキストボックスを試してみる
実際に作る画面はこんな感じ。

陳腐だけど、サンプルなので・・・。
で、こういうのをSpring MVCの仕組みを使って作るためにはどうするか。
まずは一番簡単なフォームのモデルを作ってみる。

コード


package springapp;
public class FormModel {
	private String nameInput;
	private String interests;
	public String getNameInput() {
		return nameInput;
	}
	public void setNameInput(String nameInput) {
		this.nameInput = nameInput;
	}
	public String getInterests() {
		return interests;
	}
	public void setInterests(String interests) {
		this.interests = interests;
	}
	
}

ここにあるように、nameInputと、interestsというプロパティを持つ。
命名規則とか関係ないけど、これは色々と調べながら時間かけてやったから。あんまり気にしないでください。

で、Controllerの部分。

コード


package springapp;
import java.util.HashMap;
import java.util.Map;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.ModelAttribute;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;

@Controller
public class SampleController {
	@RequestMapping(value = "/sample", method = RequestMethod.GET)
	public String firstSamplePage(Model model) {
		FormModel fm = new FormModel();
		fm.setNameInput("名前を書いてね");
		Map interests = new HashMap();
		interests.put("game", "GAME");
		interests.put("programming", "PROGRAMMING");
		interests.put("soccer", "SOCCER");
		interests.put("tennis", "TENNIS");
		model.addAttribute("formModel", fm);
		model.addAttribute("interestList", interests);
		model.addAttribute("message", "名前を入力してください");
		return "showMessage";
	}
	@RequestMapping(value = "/sample", method = RequestMethod.POST)
	public String formSample(@ModelAttribute FormModel fm, Model model) {
		String interest = fm.getInterests();
		model.addAttribute("message", "your name: " + fm.getNameInput() + " and your interest:" + interest);
		return "showMessage";
	}
}

ここのところで、select optionに入るvalueをどんどん突っ込んでいっている。
上の画面でも、セレクトボックスにここで定義した値が入っていることが確認できるはずだ。

コード


Map interests = new HashMap();
interests.put("game", "GAME");
interests.put("programming", "PROGRAMMING");
interests.put("soccer", "SOCCER");
interests.put("tennis", "TENNIS");

でも、こういうのはたぶん、本当はModelAndViewというので実装したほうがいいはず。

で、viewの部分。

コード

<!DOCTYPE html>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
<html>
<head>
<meta charset="utf-8">
<title>Welcome</title>
</head>
<body>
<h2>${message}</h2>
<form:form modelAttribute="formModel">
<form:input path="nameInput" />
<form:select path="interests">
<form:options items="${interestList}"/>
</form:select>
<input type="submit">
</form:form>
</body>
</html>
formはこの辺で定義している。

<form:form modelAttribute="formModel">
<form:input path="nameInput" />
<form:select path="interests">
<form:options items="${interestList}"/>
</form:select>
<input type="submit">
</form:form>

modelAttributeというのは、フォームの値を管理するために用意しているオブジェクトの名前のこと。
これは、Controllerで

model.addAttribute(“formModel”, fm);
と書いた、「formModel」と対応している。
で、

のpathというのは、この項目に関連付けるフィールドを表す。
ここに入力した値はModelのプロパティに関連付けられて、値が入力されるので、
Controllerの

fm.getNameInput()
で取り出して使うことができる。

で、実際にブラウザで見てみた結果は・・・
f:id:sho322:20140114000409j:plain
送信をクリックすると・・・
f:id:sho322:20140114000426j:plain