Play Frameworkで学ぶ単純なフォーム作成方法！初心者でもわかる名前・メールアドレス入力
生徒
「Play Frameworkで画面に名前やメールアドレスを入力するフォームを作りたいんですが、何から始めればいいかわかりません。」
先生
「Play Frameworkでは、画面とコントローラを組み合わせることで、簡単にフォームを作れます。」
生徒
「フォームって聞くと難しそうで不安です。」
先生
「名前とメールアドレスだけのシンプルな例から進めれば、流れが自然に理解できます。」
1. Play Frameworkでフォームを作る目的
Play Frameworkにおけるフォームとは、利用者が画面に文字を入力し、その内容をサーバ側で受け取る仕組みです。会員登録画面や問い合わせ画面など、多くのWebアプリケーションで必ず使われます。
初心者のうちは、フォーム処理と聞くだけで難しく感じがちですが、基本は「入力する画面」「送信する」「受け取る」という三つの流れだけです。今回は、名前とメールアドレスを入力する単純なフォームを例に、Play Frameworkでの基本的な作り方を丁寧に確認していきます。
2. 単純なフォーム構成をイメージしよう
フォーム作成を理解するためには、全体の構成をイメージすることが大切です。紙の申込書を思い浮かべてください。名前を書く欄があり、メールアドレスを書く欄があり、提出ボタンがあります。
Play Frameworkでも考え方は同じで、入力画面が申込書、コントローラが受付窓口の役割をします。入力された内容は、コントローラで受け取り、画面に表示したり次の処理に使ったりします。
3. フォーム用データクラスを作成する
まず最初に、フォームで扱うデータをまとめるクラスを用意します。このクラスは、入力内容を一時的に保存する箱のような存在です。
名前とメールアドレスだけを扱う場合、それぞれをフィールドとして定義します。ここでは、難しい処理は不要で、データを受け取る準備をするだけです。
package forms;
public class ContactForm {
public String name;
public String email;
}
このクラスを用意することで、Play Frameworkは「このフォームには名前とメールアドレスがある」と認識できるようになります。
4. 名前とメールアドレス入力画面を作る
次に、利用者が実際に入力する画面を作成します。Play Frameworkでは、ビューと呼ばれる仕組みを使ってHTMLを生成します。
入力欄には、それぞれ名前とメールアドレスを入力できるようにします。入力欄の名前は、先ほど作成したフォーム用クラスのフィールド名と一致させることが重要です。
<form action="/contact/submit" method="post">
<div>
<label>名前</label>
<input type="text" name="name">
</div>
<div>
<label>メールアドレス</label>
<input type="email" name="email">
</div>
<button type="submit">送信</button>
</form>
この画面で入力された内容が、送信ボタンを押すことでサーバ側へ送られます。
5. コントローラでフォームの入力内容を受け取る
フォームが送信されると、コントローラが呼び出されます。ここで、Play Frameworkの仕組みを使って入力内容を受け取ります。
コントローラは、画面とサーバ処理をつなぐ重要な役割を持っています。初心者のうちは「受け取って表示する」だけで十分です。
import play.mvc.*;
import play.data.Form;
import play.data.FormFactory;
import javax.inject.Inject;
public class ContactController extends Controller {
private final FormFactory formFactory;
@Inject
public ContactController(FormFactory formFactory) {
this.formFactory = formFactory;
}
public Result submit(Http.Request request) {
Form<ContactForm> form = formFactory.form(ContactForm.class).bindFromRequest(request);
ContactForm data = form.get();
return ok("名前：" + data.name + " メール：" + data.email);
}
}
このように、入力された名前とメールアドレスをまとめて受け取り、画面に表示することができます。
6. フォーム送信後の表示イメージ
フォームを送信すると、コントローラで処理された結果が画面に表示されます。今回は確認用として、入力された内容をそのまま文字として表示しています。
実際のアプリケーションでは、登録完了画面や確認画面へ進むことが多いですが、基本の仕組みは同じです。まずは「正しく受け取れているか」を確認することが大切です。
名前：山田太郎 メール：taro@example.com
7. 単純なフォーム作成を理解するメリット
名前とメールアドレスだけの単純なフォームを作れるようになると、Play Frameworkにおけるフォーム処理の基本が身につきます。入力画面、コントローラ、データの受け取りという流れを理解することが重要です。
この基礎ができていれば、項目が増えても考え方は変わりません。Play Frameworkのフォーム処理とバリデーションを学ぶ第一歩として、今回の例はとても大切な内容です。
