初心者でもできる！Javaでフォーム入力を作る基本ステップ【Servlet・JSP・Spring対応】

はじめに：Javaでフォーム入力を作ってみよう！

「Webアプリを作りたいけど、まず何から始めたらいいの？」
そんな人におすすめなのが、フォーム入力機能の実装です。

ユーザーの名前・性別・希望などを受け取って、表示・保存・加工するのがフォーム入力の基本です。
この記事では、Javaを使ってHTMLの入力フォームを作り、Servlet・JSP・Springで値を受け取る方法をやさしく解説します！

はじめに：Javaでフォーム入力を作ってみよう！

1. HTMLフォームの基本構造
1. 💡ポイント：
2. Servletでフォームの値を受け取る方法
3. JSPでフォーム入力値を表示する
1. 🔸 HTMLフォーム（form.jsp）
2. 🔹 JSPで表示（check.jsp）
4. 複数選択やチェックボックスの扱い方
1. ✅ 複数チェックボックスのHTML
2. ✅ Servletでの取得
5. Spring MVCでフォーム処理（上級者向け）
1. 🔸 HTMLテンプレート（Thymeleaf）
2. 🔹 コントローラー側
6. 入力チェックとバリデーションの実装
7. 入力フォームの改善ポイント
8. 練習用フォームアプリのアイデア
9. 学習の続きはこちら！

1. HTMLフォームの基本構造

HTMLでは、以下のようにフォームを作ります：

<form action="form" method="post">
    名前：<input type="text" name="username"><br>
    性別：
    <input type="radio" name="gender" value="男">男
    <input type="radio" name="gender" value="女">女<br>
    <input type="submit" value="送信">
</form>

💡ポイント：

action="form"：送信先のURL
method="post"：POSTでデータ送信
name="..."：Java側で使うキー

2. Servletでフォームの値を受け取る方法

JavaのServletでフォームの値を受け取るには、request.getParameter()を使います。

@WebServlet("/form")
public class FormServlet extends HttpServlet {
    protected void doPost(HttpServletRequest req, HttpServletResponse res)
            throws ServletException, IOException {
        String name = req.getParameter("username");
        String gender = req.getParameter("gender");

        res.setContentType("text/html;charset=UTF-8");
        PrintWriter out = res.getWriter();
        out.println("<h1>ようこそ、" + name + "さん（" + gender + "）</h1>");
    }
}

3. JSPでフォーム入力値を表示する

ServletとJSPを組み合わせることで、画面側をすっきりできます。

🔸 HTMLフォーム（form.jsp）

<form action="check.jsp" method="post">
    名前：<input type="text" name="username"><br>
    好きな色：
    <select name="color">
        <option value="赤">赤</option>
        <option value="青">青</option>
    </select><br>
    <input type="submit" value="送信">
</form>

🔹 JSPで表示（check.jsp）

<%@ page contentType="text/html; charset=UTF-8" %>
<%
    String name = request.getParameter("username");
    String color = request.getParameter("color");
%>
<p><%= name %> さんの好きな色は <%= color %> です。</p>

4. 複数選択やチェックボックスの扱い方

チェックボックスや複数選択のフォームでは、getParameterValues()を使います。

✅ 複数チェックボックスのHTML

<h3>興味のある分野：</h3>
<input type="checkbox" name="topics" value="Java">Java
<input type="checkbox" name="topics" value="Python">Python
<input type="checkbox" name="topics" value="Web">Web

✅ Servletでの取得

String[] topics = request.getParameterValues("topics");
for (String topic : topics) {
    out.println(topic + "<br>");
}

5. Spring MVCでフォーム処理（上級者向け）

Spring Bootでフォームを扱うには、@Controllerを使います。

🔸 HTMLテンプレート（Thymeleaf）

<form th:action="@{/submit}" method="post">
    <input type="text" th:field="*{name}" placeholder="名前"/>
    <button type="submit">送信</button>
</form>

🔹 コントローラー側

@Controller
public class FormController {

    @GetMapping("/")
    public String formPage(Model model) {
        model.addAttribute("user", new User());
        return "form";
    }

    @PostMapping("/submit")
    public String submit(@ModelAttribute User user, Model model) {
        model.addAttribute("name", user.getName());
        return "result";
    }
}

6. 入力チェックとバリデーションの実装

HTML側（簡易）

<input type="text" name="username" required>

Servlet側（Java）

String name = request.getParameter("username");
if (name == null || name.isEmpty()) {
    out.println("名前を入力してください！");
}

Spring Boot（本格バリデーション）

@NotBlank
private String name;

7. 入力フォームの改善ポイント

工夫	内容
Bootstrap導入	レスポンシブで見やすいフォームに
JavaScript	入力チェックを即時に反映
placeholder	入力例を表示して親切に
autocomplete	入力の省力化