表单标签库与数据绑定

表单标签库

表单标签库中包含了可以用在JSP页面中渲染HTML元素的标签。在JSP页面使用表单标签库时，需要在JSP页面开头处声明taglib指令：
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>

form表单标签

form表单标签是渲染表单元素，具体语法格式：

<form:form modelAttribute="xxx" method="xxx" action="xxx">
	...
</from:from>

表单标签除了具有HTML表单元素属性以外，还具有acceptCharset、commandName、cssClass、cssStyle、htmlEscape和modelAttribute等属性。

• acceptCharset ：定义服务器接受的字符编码列表。
• commandName：暴露表单对象的模型属性名称，默认值为command。
• cssClass：定义应用到from元素的CSS类。
• cssStyle：定义应用到form元素的CSS样式。
• htmlEscape：true或false，表示是否进行HTML转义。
• modelAttribute：暴露form backing object 的模型属性名称，默认值为command。
  其中，commandName和modelAttribute的功能基本一样，属性值绑定一个JavaBean对象。假设控制器类UserController的方法inputUser是返回userAdd.jsp的请求处理方法，如下所示：

RequestMapping("/input")
public String inputUser(HttpServletRequest request, HttpServletResponse response, Model model){
    //如果model中没有user属性，userAdd.jsp会抛异常，因为表单标签无法找到modelArrtibute属性指定的form backing object
    model.addAttribute("user", new User());
    return "userAdd";
}

那么userAdd.jsp中的表单标签应该是这样：

<form:form modelAttribute="user" method="post" action="${pageContext.request.contextPath}/user/save">
...
</form:form>

input标签、password标签、hidden标签、textarea标签

input标签：<form:input path="xxx"/>
该标签除了具有cssClass、cssStyle、htmlEscape属性以外，还有一个最重要的属性path。path属性将文本框输入值绑定到form backing object 对象的一个属性。例如：

<form:form modelAttribute="user" method="post" action="${pageContext.request.contextPath}/user/save">
	<form:input path="userName"/>
</form:form>

上述代码将输入值绑定到user对象的userName属性。

password标签、hidden标签、textarea标签的用法和input标签基本一致。但要注意的是hidden标签不能显示，不支持cssClass、cssStyle属性。

checkbox标签 、checkboxes标签

checkbox标签：<form:checkbox path="xxx" value="xxx"/>
多个path相同的checkbox标签，它们是一个选项组，允许多选，选项值绑定到一个数组属性。

checkboxes标签：<form:checkboxes path="xxx" items="xxx"/>
checkboxes标签等价于多个相同path的checkbox标签。它有3个重要属性：

• items ：用于生成input元素的Collection、Map或者Array。
• itemLabel：items属性中指定的集合对象的属性，为每个input元素提供label。
• itemValue：items属性中指定的集合对象的属性，为每个input元素提供value。

例如：

<form:checkboxes path="hobbies" items="${hobbies}"/>

上述代码将model的属性hobbies（集合元素）渲染成多个复选框。在itemLabel属性和itemValue属性省略情况下，如果集合是数组，则复选框的label和value相同；如果集合是Map，则复选框的label是Map的值（value），复选框的value是Map的关键字（key）。

radiobutton标签 、radiobuttons标签

radiobutton标签：<form:radiobutton path="xxx" value="xxx"/>
多个path相同的radiobutton标签，是一个选项组，只允许单选。

radiobuttons标签：<form:radiobuttons path="xxx" items="xxx"/>
该标签等价于多个path相同的radiobutton标签，渲染多个radio。
其中itemLabel属性和itemValue属性用法与checkboxs标签完全一样，但是只允许单选。

select标签 、options标签

select标签的选项可以来自其属性items指定的集合，也可以来自嵌套的option标签或options标签。语法格式如下：

<form:select path="xxx" items="xxx"/>

或者

<form:select path="xxx" items="xxx">
    <option value="xxx">xxx</option>
</form:select>

或者

<form:select path="xxx">
	<form:options items="xxx"/>
</form:select>

options标签用于生成一个select标签的选项列表，需要和select标签一同使用。

errors标签

errors标签用于渲染一个或多个span元素，每个span元素包含一个错误消息。该标签可以用于显示一个特定的错误消息，也可以显示所有错误消息。

<!--显示所有错误消息-->
<form:errors path="*"/>
或者
<!--显示由"xxx"指定的特定错误消息-->
<form:errors path="xxx"/>

数据绑定的应用

这里仅仅列举部分关键代码，方便理解上述的表单标签库的使用和数据绑定。

• UserController控制器

@Controller
@RequestMapping("/user")
public class UserController {
    //得到一个用来记录日志信息的对象，这样在打印信息的时候能够标记打印的是哪个类的信息
    private static final Log logger = LogFactory.getLog(UserController.class);
    @Autowired
    private UserService userService;
    @RequestMapping("/input")
    public String inputUser(HttpServletRequest request, HttpServletResponse response, Model model){
        HashMap<String, String> hobbies = new HashMap<String, String>();
        hobbies.put("篮球", "basketball");
        hobbies.put("乒乓球", "乒乓球");
        hobbies.put("电玩", "电玩");
        hobbies.put("游泳", "游泳");
        //如果model中没有user属性，userAdd.jsp会抛异常，因为表单标签无法找到modelArrtibute属性指定的form backing object
        model.addAttribute("user", new User());
        model.addAttribute("hobbies", hobbies);
        model.addAttribute("carrer", new String[]{"教师", "学生", "程序员", "IT民工", "其他"});
        return "userAdd";
    }
    @RequestMapping("/save")
    public String addUser(@ModelAttribute User user, Model model) {
        System.out.println(user);
        if (userService.addUser(user)) {
            logger.info("成功");
            //重定向到/user/list遍历users
            return "redirect:/user/list";
        } else {
            logger.info("失败");
            HashMap<String, String> hobbies = new HashMap<String, String>();
            hobbies.put("篮球", "basketball");
            hobbies.put("乒乓球", "乒乓球");
            hobbies.put("电玩", "电玩");
            hobbies.put("游泳", "游泳");
            //这里不需要model.addAttribute("user", new User())，因为@ModelAttribute已经指定
            model.addAttribute("hobbies", hobbies);
            model.addAttribute("carrer", new String[]{"教师", "学生", "程序员", "IT民工", "其他"});
            return "userAdd";
        }
    }
    @RequestMapping("/list")
    public String listUser(Model model) {
        for (User user:userService.getUsers()) {
            System.out.println(user);
        }
        model.addAttribute("users", userService.getUsers());
        return "userList";
    }
}

• userAdd.jsp

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<html>
<head>
    <title>添加User</title>
</head>
<body>
<form:form modelAttribute="user" method="post" action="${pageContext.request.contextPath}/user/save">
    <fieldset>
        <legend>添加一个用户</legend>
        <p>
            <label>用户名：</label>
            <form:input path="userName"/>
        </p>
        <p>
            <label>爱好：</label>
            <form:checkboxes path="hobbies" items="${hobbies}"/>
        </p>
        <p>
            <label>朋友：</label>
            <form:checkbox path="friends" value="张三"/>张三
            <form:checkbox path="friends" value="李四"/>李四
            <form:checkbox path="friends" value="王五"/>王五
            <form:checkbox path="friends" value="赵六"/>赵六
        </p>
        <p>
            <label>职业：</label>
            <form:select path="carrer">
                <option>请选择职业</option>
                <form:options items="${carrer}"/>
            </form:select>
        </p>
        <p>
            <label>个人描述：</label>
            <form:textarea path="remark" rows="5"/>
        </p>
        <p>
            <button type="reset">重置</button>
            <button type="submit">添加</button>
        </p>
    </fieldset>
</form:form>
</body>
</html>

运行结果图：