6月12日

ラジオボタンを使ってみる

テキストp.217からのラジオボタンの説明に従い、チェックボックスの実装を参考にしながら実装する。

以下の3つのファイルを作成する。

JSP: radio.jsp
Form: RadioModel.java
Controller: RadioController.java

アクセス先のURLは /radio とする。

RadioModel.java

package jp.abc;

public class RadioModel {
	private String radio1;

	public String getRadio1() {
		return radio1;
	}

	public void setRadio1(String radio1) {
		this.radio1 = radio1;
	}

}

radio.jsp

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

<html>
	<head>
		<meta charset="utf-8">
		<title>${title}</title>
	</head>
	<body>
		<h1>${title}</h1>
		<p>${message}</p>
		<table>
		<form:form modelAttribute="radioModel">
			<tr>
				<td>
					<form:radiobutton path="radio1" name="radio"
					label="男性" value="male" />
					<form:radiobutton path="radio1" name="radio"
					label="女性" value="female"/>
					</td>
			</tr>
			<tr><td><input type="submit" /></td></tr>
		</form:form>
		</table>
	</body>
</html>

RadioController.java

package jp.abc;

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 RadioController {

	@RequestMapping(value = "/radio", method = RequestMethod.GET)
	public String radio(Model model) {
		model.addAttribute("title", "Sample");
		model.addAttribute("message", "Radiobuttonのサンプルです。");
		RadioModel rm = new RadioModel();
		rm.setRadio1("male");
		model.addAttribute("radioModel", rm);
		return "radio";
	}

	@RequestMapping(value = "/radio", method = RequestMethod.POST)
	public String form(@ModelAttribute RadioModel rm, Model model) {
		model.addAttribute("title", "Sample");
		model.addAttribute("message", "selected: " + rm.getRadio1());
		return "radio";
	}
}

ラジオボタンをまとめて作成する

チェックボックスで作成したサンプルを参照しつつ、ラジオボタンをまとめて作成してみる。
タグは form:radiobuttons を使用する。

RadioModelには、追加するラジオボタンの値を保持するために radio2 を追加する。

RadioModel.java

package jp.abc;

public class RadioModel {
	private String radio1;
	private String radio2;

	public String getRadio1() {
		return radio1;
	}

	public void setRadio1(String radio1) {
		this.radio1 = radio1;
	}

	public String getRadio2() {
		return radio2;
	}

	public void setRadio2(String radio2) {
		this.radio2 = radio2;
	}

}

radio.jsp も、チェックボックスと同様に、テーブルに行を追加して表示する。

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

<html>
	<head>
		<meta charset="utf-8">
		<title>${title}</title>
	</head>
	<body>
		<h1>${title}</h1>
		<p>${message}</p>
		<table>
		<form:form modelAttribute="radioModel">
			<tr>
				<td>
					<form:radiobutton path="radio1" name="radio"
					label="男性" value="male" />
					<form:radiobutton path="radio1" name="radio"
					label="女性" value="female"/>
				</td>
			</tr>
			<tr>
				<td>
					<form:radiobuttons path="radio2" name="radio2"
					items="${radiolist}" itemLabel="label"
					itemValue="data" delimiter=" "/>
				</td>
			</tr>
			<tr><td><input type="submit" /></td></tr>
		</form:form>
		</table>
	</body>
</html>

コントローラも変更箇所は少ない。

package jp.abc;

import java.util.ArrayList;
import java.util.List;

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 RadioController {
	private List<ListDataModel> getList() {
		List<ListDataModel> list = new ArrayList<ListDataModel>();
		list.add(new ListDataModel("マック", "Mac"));
		list.add(new ListDataModel("ウィンドウズ", "Windows"));
		list.add(new ListDataModel("リナックス", "Linux"));
		return list;
	}

	@RequestMapping(value = "/radio", method = RequestMethod.GET)
	public String radio(Model model) {
		model.addAttribute("title", "Sample");
		model.addAttribute("message", "Radiobuttonのサンプルです。");
		RadioModel rm = new RadioModel();
		rm.setRadio1("male");
		rm.setRadio2("Mac");
		model.addAttribute("radioModel", rm);
		model.addAttribute("radiolist", getList());
		return "radio";
	}

	@RequestMapping(value = "/radio", method = RequestMethod.POST)
	public String form(@ModelAttribute RadioModel rm, Model model) {
		model.addAttribute("title", "Sample");
		model.addAttribute("message", "selected: " + rm.getRadio1()
							+ " and " + rm.getRadio2());
		model.addAttribute("radiolist", getList());
		return "radio";
	}
}

form:selectによる選択リストの作成

以下の3つのファイルを作成する。

select.jsp
SelectModel.java
SelectController.java

アクセス先のURL: /select

SelectModel.java

package jp.abc;

public class SelectModel {
	private String select1;

	public String getSelect1() {
		return select1;
	}

	public void setSelect1(String select1) {
		this.select1 = select1;
	}
}

select.jsp

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

<html>
	<head>
		<meta charset="utf-8">
		<title>${title}</title>
	</head>
	<body>
		<h1>${title}</h1>
		<p>${message}</p>
		<table>
		<form:form modelAttribute="selectModel">
			<tr>
				<td><form:select path="select1" items="${optionlist}"
				itemLabel="label" itemValue="data"
				size="5" multiple="false" />
			</tr>
			<tr><td><input type="submit" /></td></tr>
		</form:form>
		</table>
	</body>
</html>

SelectController.java

package jp.abc;

import java.util.ArrayList;
import java.util.List;

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 SelectController {
	private List<ListDataModel> getList() {
		List<ListDataModel> list = new ArrayList<ListDataModel>();
		list.add(new ListDataModel("マック", "Mac"));
		list.add(new ListDataModel("ウィンドウズ", "Windows"));
		list.add(new ListDataModel("リナックス", "Linux"));
		return list;
	}

	@RequestMapping(value = "/select", method=RequestMethod.GET)
	public String select(Model model) {
		model.addAttribute("title", "Sample");
		model.addAttribute("message", "Selectのサンプルです。");
		SelectModel sm = new SelectModel();
		sm.setSelect1("Mac");
		model.addAttribute("selectModel", sm);
		model.addAttribute("optionlist", getList());
		return "select";
	}

	@RequestMapping(value = "/select", method = RequestMethod.POST)
	public String form(@ModelAttribute SelectModel sm, Model model) {
		model.addAttribute("title", "Sample");
		model.addAttribute("message", "selected: " + sm.getSelect1());
		model.addAttribute("selectModel", sm);
		model.addAttribute("optionlist", getList());
		return "select";
	}
}

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です