Spring の@RequestParamの使い方!テキストボックス、ラジオボタン、チェックボックス、セレクトボックスの値を受け取る。
生徒
「Spring Bootでフォームからデータを受け取る方法がわからないんですけど、教えてもらえますか?」
先生
「もちろん!Spring Bootでは、Thymeleafを使って簡単にフォームを作成し、データを受け取ることができます。フォームの作成と処理の流れを一緒に見ていきましょう。」
生徒
「具体的には、テキストボックスやラジオボタン、セレクトボックス、チェックボックスのデータを受け取りたいんです。」
先生
「了解です。それでは、それぞれのフォーム入力の方法と受け取り方を解説しますね!」
1. Spring BootとThymeleafでフォームを作成する
まずは、Spring BootプロジェクトにThymeleafを追加して、フォームを作成していきましょう。Thymeleafはテンプレートエンジンで、HTMLファイルに動的なデータを簡単に表示するために使用されます。
以下の手順でフォームを作成し、データを受け取る方法を解説します。
2. テキストボックスの値を受け取る
テキストボックスからのデータを受け取るには、以下のようなコードを使用します。まず、Thymeleafのテンプレートでフォームを作成し、Spring Bootのコントローラーでデータを処理します。
<!-- Thymeleafテンプレート: form.html -->
<form th:action="@{/submit}" th:method="post">
<label for="name">名前:</label>
<input type="text" id="name" name="name" />
<button type="submit">送信</button>
</form>
次に、Spring Bootのコントローラーでフォームのデータを受け取るコードを記述します。
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestParam;
@Controller
public class FormController {
@PostMapping("/submit")
public String submitForm(@RequestParam("name") String name) {
System.out.println("名前: " + name);
return "result";
}
}
これで、ユーザーが名前を入力して送信すると、Spring Bootがデータを受け取り、コンソールに表示されます。
3. ラジオボタンの値を受け取る
ラジオボタンを使用して、ユーザーに選択肢を選んでもらうことができます。以下はラジオボタンの例です。
<!-- Thymeleafテンプレート: form.html -->
<form th:action="@{/submit}" th:method="post">
<label>性別:</label>
<input type="radio" id="male" name="gender" value="male" />
<label for="male">男性</label>
<input type="radio" id="female" name="gender" value="female" />
<label for="female">女性</label>
<button type="submit">送信</button>
</form>
Spring Bootのコントローラーは次のように設定します。
@PostMapping("/submit")
public String submitForm(@RequestParam("gender") String gender) {
System.out.println("性別: " + gender);
return "result";
}
これにより、ユーザーが性別を選択して送信すると、その値が受け取られます。
4. セレクトボックスの値を受け取る
セレクトボックスを使えば、ユーザーに複数の選択肢から一つを選んでもらうことができます。以下の例を見てみましょう。
<!-- Thymeleafテンプレート: form.html -->
<form th:action="@{/submit}" th:method="post">
<label for="country">国:</label>
<select id="country" name="country">
<option value="japan">日本</option>
<option value="usa">アメリカ</option>
<option value="uk">イギリス</option>
</select>
<button type="submit">送信</button>
</form>
そして、Spring Bootのコントローラー側は以下のようにします。
@PostMapping("/submit")
public String submitForm(@RequestParam("country") String country) {
System.out.println("国: " + country);
return "result";
}
これで、ユーザーが選択した国の値を受け取ることができます。
5. チェックボックスの値を受け取る
チェックボックスを使うと、ユーザーに複数のオプションを選ばせることができます。例えば、以下のように実装します。
<!-- Thymeleafテンプレート: form.html -->
<form th:action="@{/submit}" th:method="post">
<label>趣味:</label>
<input type="checkbox" name="hobby" value="sports" /> スポーツ
<input type="checkbox" name="hobby" value="music" /> 音楽
<input type="checkbox" name="hobby" value="reading" /> 読書
<button type="submit">送信</button>
</form>
チェックボックスの値を受け取る際、複数の選択肢がある場合は、以下の2つのパターンでコントローラー側で処理することができます。
1. Listで受け取るパターン
最初に、Listを使った方法です。
@PostMapping("/submit")
public String submitForm(@RequestParam("hobby") List<String> hobbies) {
System.out.println("趣味: " + hobbies);
return "result";
}
複数の趣味が選択された場合、それらがリストとしてコントローラーに渡されます。例えば、ユーザーが「スポーツ」と「音楽」を選択した場合、コンソールには以下のように表示されます。
趣味: [sports, music]
2. 配列で受け取るパターン
次に、String[]を使った方法です。
@PostMapping("/submit")
public String submitForm(@RequestParam("hobby") String[] hobbies) {
System.out.println("趣味: " + Arrays.toString(hobbies));
return "result";
}
この場合も、ユーザーが選択した複数の値が配列として受け取れます。配列の要素をArrays.toString()メソッドで表示すれば、以下のように出力されます。
趣味: [sports, music]
どちらの方法も、複数のチェックボックスの値を簡単に処理するのに便利です。フォームの内容に応じて使い分けてください。
6. @RequestParamのrequired・defaultValueで「未入力」を安全に扱う
フォームで未入力だった場合にエラーを出さずに受け取りたいときは、@RequestParamのrequiredやdefaultValueを使います。Spring Bootでは、テキストボックスやラジオボタン、チェックボックスの値が送信されないケースでも、安全に処理できます。
<!-- Thymeleaf: ageは未入力でもOK -->
<form th:action="@{/submit/optional}" th:method="post">
<label for="age">年齢(任意):</label>
<input type="number" id="age" name="age" />
<label class="ms-3" for="nick">ニックネーム(任意):</label>
<input type="text" id="nick" name="nickname" />
<button type="submit">送信</button>
</form>
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestParam;
@Controller
public class OptionalParamController {
// defaultValue を指定すると required は自動的に無視される(必須ではなくなる)
@PostMapping("/submit/optional")
public String submitOptional(
@RequestParam(name = "age", defaultValue = "0") int age, // 未入力→0
@RequestParam(name = "nickname", required = false) String nickname // 未入力→null
) {
System.out.println("age=" + age + ", nickname=" + nickname);
return "result";
}
}
intのようなプリミティブ型はnullを受け取れないため、defaultValueで初期値を入れておくのが実務では安全です。Stringはnull許容なのでrequired=falseで十分です。
7. パラメータ名の変更(name/valueエイリアス)でフォーム名と受取名を切り分ける
テンプレート側のname属性と、コントローラー側の変数名を分けたい場合は、@RequestParam(name="...")(またはvalue)を使います。@RequestParamの使い方としてSEOでもよく検索される実装ポイントです。
<!-- フロント側では user_name という名前で送る -->
<form th:action="@{/submit/alias}" th:method="post">
<label for="user_name">お名前:</label>
<input type="text" id="user_name" name="user_name" />
<button type="submit">送信</button>
</form>
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestParam;
@Controller
public class AliasParamController {
@PostMapping("/submit/alias")
public String submitAlias(
@RequestParam(name = "user_name") String name // HTMLの user_name を name で受け取る
// @RequestParam(value = "user_name") でもOK
) {
System.out.println("name=" + name);
return "result";
}
}
既存フォームのパラメータ名を変えられないときや、サーバー側で読みやすい命名にしたいときに便利です。
8. セレクトボックス(multiple)で複数値を受け取る
セレクトボックスにmultiple属性を付けると、チェックボックスと同様に複数の値を選択・送信できます。List<String>やString[]で受け取るのが@RequestParamの基本パターンです。
<!-- 複数選択可能なセレクトボックス -->
<form th:action="@{/submit/multi-select}" th:method="post">
<label for="skills">スキル(複数選択可):</label>
<select id="skills" name="skills" multiple size="5">
<option value="java">Java</option>
<option value="spring">Spring</option>
<option value="thymeleaf">Thymeleaf</option>
<option value="docker">Docker</option>
<option value="aws">AWS</option>
</select>
<button type="submit">送信</button>
</form>
import java.util.List;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestParam;
@Controller
public class MultiSelectController {
@PostMapping("/submit/multi-select")
public String submitMultiSelect(@RequestParam("skills") List<String> skills) {
System.out.println("skills=" + skills);
return "result";
}
}
複数選択が未選択(=送信なし)の場合に備えるなら、required=false+空リスト代入などの対策も検討しましょう。
まとめ
この記事では、Spring BootとThymeleafを使用してフォームデータを受け取る方法について詳しく解説しました。テキストボックス、ラジオボタン、セレクトボックス、チェックボックスといった基本的なフォーム入力から、それぞれのデータを受け取り、処理する流れを確認しました。
特に、@RequestParamを使用することで、Spring Bootで簡単にフォームデータを取得できることがわかりました。また、データを受け取るだけでなく、テンプレートエンジンThymeleafを活用して、動的なHTMLページを生成する方法についても学びました。
フォームのデータを受け取る実装例として、リストや配列でチェックボックスの値を処理する方法や、th:actionやth:methodを活用したフォームの作成方法を解説しました。これにより、フォームから送信されたデータをバックエンドで簡単に利用できるようになります。
以下に、この記事で学んだ内容を整理し、すぐに使えるサンプルコードをまとめます。Spring BootプロジェクトでThymeleafを活用したフォーム処理の実装をぜひ試してみてください。
<!-- Thymeleafテンプレート: form.html -->
<form th:action="@{/submit}" th:method="post">
<label for="name">名前:</label>
<input type="text" id="name" name="name" />
<br/>
<label for="gender">性別:</label>
<input type="radio" id="male" name="gender" value="male" /> 男性
<input type="radio" id="female" name="gender" value="female" /> 女性
<br/>
<label for="country">国:</label>
<select id="country" name="country">
<option value="japan">日本</option>
<option value="usa">アメリカ</option>
<option value="uk">イギリス</option>
</select>
<br/>
<label>趣味:</label>
<input type="checkbox" name="hobby" value="sports" /> スポーツ
<input type="checkbox" name="hobby" value="music" /> 音楽
<input type="checkbox" name="hobby" value="reading" /> 読書
<br/>
<button type="submit">送信</button>
</form>
この記事で紹介した内容を参考に、Spring Bootを使用した効率的なフォーム処理を試してみてください。Thymeleafを活用することで、バックエンドとフロントエンドの統合がスムーズになります。
生徒
「Spring Bootでフォームの入力を受け取る方法がわかってきました!Thymeleafも便利ですね。」
先生
「そうですね。フォームデータを簡単に処理できるのはSpring Bootの強みです。Thymeleafとの連携でさらに便利になりますよ。」
生徒
「リストや配列でチェックボックスの値を受け取る方法が印象的でした。複数選択肢がある場合に便利ですね!」
先生
「その通りです。選択肢の多いフォームも簡単に対応できます。次はバリデーションの方法について学ぶと良いですね。」
生徒
「ぜひ学びたいです!Spring BootとThymeleafの可能性をもっと広げていきたいと思います。」
先生
「頑張ってください。次回はフォーム入力のバリデーションについて詳しく説明します!」