Servlet与表单数据交互（如文本框、单选按钮、复选框、下拉列表等）

在这里插入图片描述

✅作者简介：热爱国学的Java后端开发者，修心和技术同步精进。
🍎个人主页：Java Fans的博客
🍊个人信条：不迁怒，不贰过。小知识，大智慧。
💞当前专栏：JAVA开发者成长之路
✨特色专栏：国学周更-心性养成之路
🥭本文内容：Servlet与表单数据交互（如文本框、单选按钮、复选框、下拉列表等）
更多内容点击👇
一文解决IDEA中文乱码问题

【本文目录】

- 💖 前言
- 💖 创建表单
- 💖 Servlet类
- 💖 文本字段和密码字段值的读取
- 💖 单选按钮字段值的读取
- 💖 复选框字段值的读取
- 💖 下拉列表（组合框）字段值的读取
- 💖 文本区域字段值的读取
- 💖 完整代码分享

在这里插入图片描述

💖 前言

动态Web请求中最重要的是与访问用户的交互。而交互性的基本形式就是HTML表单，表单中常用的提交模式为POST，这样就必须在处理的Servlet类中明确进行doPost()方法覆写。

本篇中，我将指导您如何使用Java Servlet从服务器端的 HTML 表单中读取常用输入字段的值。您知道，处理以 HTML 页面表示的表单数据是 Web 开发中非常常见的任务。一个典型的场景是用户填写表单的字段并提交。服务器将根据提交的数据处理请求，并将响应发送回客户端。

下图描述了在服务器端使用 Java servlet 的工作流：

在这里插入图片描述

💖 创建表单

在form01.html页面中创建表单，我们需要使用以下标签：

<form>：创建一个表单以在其正文中添加字段。
<input> , <select> , <textarea> …：创建表单字段，如文本框、密码框、单选按钮、复选框、下拉列表、文本区域……和提交按钮。

为了使表单与 Java servlet 一起工作，我们需要为标记指定以下属性：

method =”post”：将表单数据作为 HTTP POST 请求发送到服务器。一般情况下，表单提交应该在 HTTP POST 方法中完成。
action =” servlet 的 URL ”：指定负责处理从该表单发布的数据的 servlet 的相对 URL。

在进行表单提交时需要注意请求处理的Servlet映射路径要与HTML页面路径相匹配。例如：form01.html页面储存在/welcome路径下，为了便于访问一般会将Servlet的映射路径也设置同样的路径，如下图所示：

在这里插入图片描述

💖 Servlet类

servlet 的 URL 由servlet 类之前的 @WebServlet 注释指定。当用户提交上面的登录表单时，servlet 容器会调用servlet 的 doPost()方法 。通常，我们将在doPost()方法中执行以下任务：

通过请求 对象（javax.servlet.http.HttpServletRequest接口的实现）读取从表单发布的字段的值。
做一些处理，例如连接到数据库来验证用户名和密码。
通过响应 对象（javax.servlet.http.HttpServletResponse接口的实现）将响应返回给用户。

为了读取表单字段的值，HttpServletRequest 接口提供了以下方法：

String getParameter(String name)：获取由给定名称指定的字段的值，作为字符串。如果不存在具有给定名称的表单字段，则该方法返回 null。
String[] getParameterValues(String name): 在 String 对象数组中获取一组具有相同名称的字段的值。如果不存在具有给定名称的字段，则该方法返回 null。
请注意，上述方法还可以处理 URL 查询字符串中的参数，因此名称为 getParameter。

例如，我们可以在doPost()方法中编写以下代码来读取表单字段的值：

        String name= req.getParameter("userName");
        String age= req.getParameter("userAge");

要将响应发送回客户端，我们需要通过调用HttpServletResponse接口的 getWriter()方法 从响应对象中获取写入器，然后使用print()或println()方法 传递响应。例如：

        String name= req.getParameter("userName");
        String age= req.getParameter("userAge");
        resp.getWriter().println("你好！"+name+"！你今年"+age+"岁！");

💖 文本字段和密码字段值的读取

【1】HTML 表单代码

  <p>用户名：<input type="text" name="userName"/></p>
  <p>用户密码：<input type="password" name="userPassword"/></p>

【2】HTML 表单运行效果

在这里插入图片描述

【3】Servlet 中的 Java 代码

        String name= req.getParameter("userName");
        String password= req.getParameter("userPassword");
        resp.getWriter().println("用户名："+name+",用户密码："+password);

【4】提交表单后运行效果

在这里插入图片描述

💖 单选按钮字段值的读取

【1】HTML 表单代码

<p>性别：<input type="radio" name="sex" value="男" checked/>男 
		<input type="radio" name="sex" value="女"/>女</p>

【2】HTML 表单运行效果

在这里插入图片描述

【3】Servlet 中的 Java 代码

	String sex= req.getParameter("sex");
	resp.getWriter().println("性别："+sex);

【4】提交表单后运行效果

在这里插入图片描述

💖 复选框字段值的读取

【1】HTML 表单代码

 <p>兴趣爱好：<input type="checkbox" name="hobby" value="篮球"/>篮球 
 			 <input type="checkbox" name="hobby" value="足球"/>足球</p>

【2】HTML 表单运行效果

在这里插入图片描述

【3】Servlet 中的 Java 代码

        String[] hobbys=req.getParameterValues("hobby");
        String a="";
        for(int i=0;i<hobbys.length;i++)
        {a+="【"+hobbys[i]+"】";}
        resp.getWriter().println("兴趣爱好："+a);

【4】提交表单后运行效果

在这里插入图片描述

💖 下拉列表（组合框）字段值的读取

【1】HTML 表单代码

    用户年龄：<select name="userAge">
      <option name="opAge" value="18">18</option>
      <option name="opAge" value="19">19</option>
      <option name="opAge" value="20">20</option>
      <option name="opAge" value="21">21</option>
  </select>

【2】HTML 表单运行效果

在这里插入图片描述

【3】Servlet 中的 Java 代码

        String opAge = req.getParameter("userAge");
        resp.getWriter().println("年龄："+opAge);

【4】提交表单后运行效果

在这里插入图片描述

💖 文本区域字段值的读取

【1】HTML 表单代码

  <p>个人简介：<textarea name="perIntro" rows="5" cols="30"></textarea></p>

【2】HTML 表单运行效果

在这里插入图片描述

【3】Servlet 中的 Java 代码

        String perIntro= req.getParameter("perIntro");
        resp.getWriter().println("个人简介："+perIntro);

【4】提交表单后运行效果

在这里插入图片描述

💖 完整代码分享

【1】HTML页面：form01.html 代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>作业一</title>
</head>
<body>
<!--welcome为HTML页面路径，要与Servlet映射路径相匹配-->
<form action="welcome" method="post">
  <p>用户名：<input type="text" name="userName"/></p>
  <p>用户密码：<input type="password" name="userPassword"/></p>
  <p>性别：<input type="radio" name="sex" value="男" checked/>男 <input type="radio" name="sex" value="女"/>女</p>
  <p>兴趣爱好：<input type="checkbox" name="hobby" value="篮球"/>篮球 <input type="checkbox" name="hobby" value="足球"/>足球</p>
    用户年龄：<select name="userAge">
      <option name="opAge" value="18">18</option>
      <option name="opAge" value="19">19</option>
      <option name="opAge" value="20">20</option>
      <option name="opAge" value="21">21</option>
  </select>
  <p>个人简介：<textarea name="perIntro" rows="5" cols="30"></textarea></p>
  <p><input type="submit" value="提交"/></p>
</form>
</body>
</html>

【2】Servlet类：FormServletDemo01.java 代码

package cn.lqgx.www;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;

//注解方式替换web.xml中的配置，Servlet映射路径
@WebServlet("/welcome")
public class FormServletDemo01 extends HttpServlet {
    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        req.setCharacterEncoding("UTF-8");
        resp.setCharacterEncoding("UTF-8");
        String name= req.getParameter("userName");
        String password= req.getParameter("userPassword");
        String sex= req.getParameter("sex");

        String[] hobbys=req.getParameterValues("hobby");
        String a="";
        for(int i=0;i<hobbys.length;i++)
        {a+="【"+hobbys[i]+"】";}

        String opAge = req.getParameter("userAge");
        String perIntro= req.getParameter("perIntro");
        resp.getWriter().println("用户名："+name+",用户密码："+password+",性别："+sex+",兴趣爱好："+a+",年龄："+opAge+"，个人简介："+perIntro);
//        System.out.println("用户名："+name+",用户密码："+password+",性别："+sex+",兴趣爱好："+a+",年龄："+opAge);
    }

    @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        doGet(req, resp);
    }
}