MVC---表单标签库

2024-06-23 15:38
文章标签 mvc 表单 标签

本文主要是介绍MVC---表单标签库,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

前言
    spring MVC表单标签库,能够简化我们的代码开发,提高开发效率,那么如何简化代码开发呢?一起来看看吧👇

EL获取业务数据
    我们首先做一个小案例,用EL表达式获取业务数据,以此来体现出spring MVC表单标签库特点。
    案例背景:控制器返回业务数据到视图层,视图层通过EL获取业务数据绑定到JSP页面表单中。
(1)创建student实体类

public class Student {
    private String name;
    private String password;
    //省略setter,getter,toString方法
}
1
2
3
4
5
(2)创建Handler处理器

@Controller
public class excelController {

    @RequestMapping("test")
    public ModelAndView test(ModelAndView modelAndView){
        Student student=new Student();
        student.setName("jacob");
        student.setPassword("123");
        modelAndView.addObject("student",student);
        modelAndView.setViewName("/excel");
        return modelAndView;
    }
}
1
2
3
4
5
6
7
8
9
10
11
12
13
(3)创建JSP页面,用于数据展示

<body>
${student.name}
${student.password}
</body>
1
2
3
4
(4)测试
student表示业务数据对象
name、password表示业务数据对象属性名

MVC表单标签获取业务数据
   使用spring MVC表单标签库可以直接将业务数据绑定到JSP表单中。
我们将上边案例改写为MVC表单标签库的方式,修改JSP即可。

<body>
<form:form modelAttribute="student">
    <form:input path="name" readonly="true"/>
    <form:input path="password" readonly="true"/>
</form:form>
</body>
1
2
3
4
5
6
测试:

   数据以文本框的形式在页面显示,但由于我设置了readonly=“true”,因此目前是只读。
<form:form>通过modelAttribute绑定具体的业务数据
<form:input>通过path获取绑定业务数据的具体属性值

以下是spring MVC表单标签库的常用标签及使用:

form标签
<form:form modelAttribute="student" method="post">
1
   渲染的是HTML中的form:form通过modelAttribute绑定具体的业务数据。

input标签
<form:input path="name"/>
1
   渲染的是HTML中的<input type="text">,input标签绑定业务数据中的属性值,通过path与业务数据的属性名对应,并支持级联属性。

password标签
<form:password path="password"/>
1
   渲染的是HTML中的<input type="password">,password标签绑定业务数据中的属性值,通过path与业务数据的属性名对应,password的值在页面中不会显示。


checkbox标签
<form:checkbox path="hobby" value="学编程"/>学编程
1

   渲染的是HTML中的<input type="checkbox">,checkbox标签绑定业务数据中的属性值,通过path与业务数据的属性名对应,可以绑定boolean,如果boolean为true,则选中,否则不选中。
   同时,checkbox也支持绑定数组和集合。
   如果绑定数组或集合,则集合中的元素等于checkbox中的value值,选项选中,否则不选中。

//Controller
 student.setHobby(Arrays.asList("学编程","写博客","听音乐"));
1
2
<form:form modelAttribute="student">
    <form:checkbox path="hobby" value="学编程"/>学编程
    <form:checkbox path="hobby" value="写博客"/>写博客
    <form:checkbox path="hobby" value="听音乐"/>听音乐
</form:form>
1
2
3
4
5
   渲染的是HTML中的<input type="checkbox">,集合中的元素等于checkbox的value值,则该选项选中,否则不选中。


checkboxs标签
   如果checkbox有多个选项,我们可以考虑checkboxs,结合items简化代码👇

//Controller
student.setHobby(Arrays.asList("学编程","写博客","听音乐","打游戏","看电影"));
student.setSelecthobby(Arrays.asList("学编程","写博客","看电影"));
1
2
3
<body>
<form:form modelAttribute="student">
    <form:checkboxes path="selecthobby" items="${student.hobby}"/>
</form:form>
</body>
1
2
3
4
5
   渲染的是HTML中的每一组<input type="checkbox">,form:form标签的modelAttribute绑定业务数据,form:checkboxes标签的path绑定业务数据被选中的集合或数组,表示选中的,form:checkboxes标签的items绑定被遍历的集合或数组,表示全部;注意items需要通过EL的方式从域对象中取值。


radiobutton标签
//Controller
student.setRadioId(1);
1
2
<form:form modelAttribute="student">
    <form:radiobutton path="radioId" value="0"/>radio0
    <form:radiobutton path="radioId" value="1"/>radio1
    <form:radiobutton path="radioId" value="2"/>radio2
</form>
1
2
3
4
5

   渲染的是HTML中的一个<input type="radio"/>,form:form标签的modelAttribute绑定业务数据,form:radiobutton标签的path绑定业务数据的属性值,form:radiobutton标签的value与path绑定的属性值进行比较,若相等则选项框选中。

radiobuttons标签
//Controller
student.setRadioIds(Arrays.asList(1,2,3,4,5));
student.setRadioId(Arrays.asList(5));
1
2
3
<form:form modelAttribute="student">
    <form:radiobuttons path="radioId" items="${student.radioIds}"/>
</form>
1
2
3

   渲染的是HTML中的一组<input type="radio"/>,form:form标签的modelAttribute绑定业务数据,form:radiobuttons标签的path绑定业务数据的属性值,form:radiobuttons标签的items绑定业务数据的集合,与path绑定的属性值进行比较,若相等则选项框选中,注意form:radiobuttons标签的items需要用EL获取数据 radiobuttons标签只能选中一个选项框。

select标签
//Controller
Student student=new Student();
Map<Integer,String> map=new HashMap<Integer, String>();
Map<Integer,String> map1=new HashMap<Integer, String>();
map.put(1,"可乐");
map.put(2,"雪碧");
map.put(3,"绿茶");
map1.put(2,"雪碧");
student.setSelectIds(map);
student.setSelectId(map1);
1
2
3
4
5
6
7
8
9
10
<form:form modelAttribute="student">
    可选饮料:<form:select path="selectId" items="${student.selectIds}"/>
</form:form>
1
2
3

   渲染的是HTML中的每一组<input type="select">,form:form标签的modelAttribute绑定业务数据,form:select标签的path绑定业务数据的属性值,form:select标签的items绑定业务数据的集合,与path绑定的属性值进行比较,若相等则选项框展示内容,注意form:options标签的items需要用EL获取数据

select结合options标签
//Controller
        Student student=new Student();
        Map<Integer,String> map=new HashMap<Integer, String>();
        map.put(1,"学编程");
        map.put(2,"写博客");
        map.put(3,"听音乐");
        map.put(4,"看电影");
        student.setHobby(map);
        student.setSelecthobby(3);
1
2
3
4
5
6
7
8
9
public class Student {
    private Map<Integer,String> hobby;
    private int selecthobby;
    //省略getter,setter,toString方法
1
2
3
4
<form:form modelAttribute="student">//获取student业务数据
    <form:select path="selecthobby">//获取student业务数据的属性值id
       <form:options items="${student.hobby}"/>//遍历student数据hobby集合
    </form:select>
</form:form>
1
2
3
4
5
   form:form标签的modelAttribute绑定业务数据的student,form:select标签的path绑定业务数据的属性值,form:options标签的items绑定业务数据的集合,与path绑定的属性值进行比较,若相等则选项框展示内容,注意form:options标签的items需要用EL获取数据。

select结合option标签
<form:form modelAttribute="student">
   <form:select path="selecthobby">
       <form:option value="1">学编程</form:option>
       <form:option value="2">写博客</form:option>
       <form:option value="3">听音乐</form:option>
       <form:option value="4">看电影</form:option>
   </form:select>
</form:form>
1
2
3
4
5
6
7
8
   form:form标签的modelAttribute绑定业务数据student,form:select标签的path绑定业务数据的属性值,与每一个form:option标签的value进行比较,若相等则选项框展示内容。

textarea标签
//Student.java
private String introduce;
1
2
//Controller
student.setIntroduce("你好,我叫...");
1
2
<form:form modelAttribute="student">
    <form:textarea path="introduce"/>
</form:form>
1
2
3

   form:form标签的modelAttribute绑定业务数据student,form:textarea标签的path绑定业务数据的属性值。

hidden标签
<form:form modelAttribute="student">
    <form:hidden path="introduce"/>
</form:form>
1
2
3
   form:form标签的modelAttribute绑定业务数据student,form:hidden标签的path绑定业务数据的属性值。此标签在页面不显示。

errors标签
   errors标签在spring MVC数据安全校验那篇博客用到过,我将那片博客粘贴过来😄,errors标签需要结合数据安全校验一起使用,因此还需要自定义校验器并实现Validator接口,完整过程如下👇:
(1)创建一个Student类

public class Student {
    private String name;
    private String password;
    //省略getter,setter,toString方法
}
1
2
3
4
5
(2)自定义校验器StudentValidator,实现Validator接口,重写接口的抽象方法,加入校验规则

public class StudentValidator implements Validator {
    public boolean supports(Class<?>  clazz) {
        return Student.class.equals(clazz);
    }

    public void validate(Object o, Errors errors) {
        ValidationUtils.rejectIfEmpty(errors,"name",null,"姓名不能为空");
        ValidationUtils.rejectIfEmpty(errors,"password",null,"密码不能为空");
    }
}
1
2
3
4
5
6
7
8
9
10
(3)创建控制器StudentController,POST请求的业务方法login参数列表中@Validator表示参数student是需要校验的对象,@BindingResult用来存储错误信息,两者缺一不可,并且这两个参数要紧挨在一起,中间不能有其他参数。

@Controller
@RequestMapping("/student")
public class StudentController {

    @RequestMapping(value = "/login",method = RequestMethod.GET)
    public String login(Model model){
        model.addAttribute(new Student());
        return "login";
    }

    @RequestMapping(value = "/login",method = RequestMethod.POST)
    public String login(@Validated Student student, BindingResult br){
        if(br.hasErrors()){
            return "login";
        }
        return "success";
    }
}
(4)创建JSP页面

<body>
<h1>学生登录</h1>
<form:form modelAttribute="student" action="login" method="post">
    学生姓名:<form:input path="name"/><form:errors path="name"/><br/>
    学生密码:<form:input path="password"/><form:errors path="password"/><br/>
    <input type="submit" value="提交"/>
</form:form>
</body>
(5)测试,首先用get请求访问传参name和password,然后输入框中不填使用POST请求进行访问

总结
   spring MVC表单标签库相比于JSP标准标签库JSTL更加简洁方便,简化了很多操作步骤,同时还可以自动完成数据的绑定,将业务数据绑定到视图层的对应模块做展示。
————————————————
版权声明:本文为CSDN博主「pony爱学校」的原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/llllxxxxyyyy/article/details/104171121

这篇关于MVC---表单标签库的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1087574

相关文章

vscode-创建vue3项目-修改暗黑主题-常见错误-element插件标签-用法涉及问题

文章目录 1.vscode创建运行编译vue3项目2.添加项目资源3.添加element-plus元素4.修改为暗黑主题4.1.在main.js主文件中引入暗黑样式4.2.添加自定义样式文件4.3.html页面html标签添加样式 5.常见错误5.1.未使用变量5.2.关闭typescript检查5.3.调试器支持5.4.允许未到达代码和未定义代码 6.element常用标签6.1.下拉列表

BD错误集锦8——在集成Spring MVC + MyBtis编写mapper文件时需要注意格式 You have an error in your SQL syntax

报错的文件 <?xml version="1.0" encoding="UTF-8" ?><!DOCTYPE mapperPUBLIC "-//mybatis.org//DTD Mapper 3.0//EN""http://mybatis.org/dtd/mybatis-3-mapper.dtd"><mapper namespace="com.yuan.dao.YuanUserDao"><!

BD错误集锦7——在集成Spring MVC + MyBtis时使用c3p0作为数据库时报错Method com/mchange/v2/c3p0/impl/NewProxyPreparedStatem

异常信息如下: Type Exception ReportMessage Handler dispatch failed; nested exception is java.lang.AbstractMethodError: Method com/mchange/v2/c3p0/impl/NewProxyPreparedStatement.isClosed()Z is abstractDescr

Spring MVC的核心类和注解——@RequestMapping注解(二)@RequestMapping注解的属性

一、@RequestMapping注解的属性 属性名 类型 描述 name String 可选属性,用于为映射地址指定别名。 value String[] 可选属性,也是默认属性,用于指定请求的URL。 method RequestMethod[] 可选属性,用于指定该方法可以处理哪种类型的请求方式。 params String[] 可选属性,用于指定客户端请求中参数的值,必须包含

示例:推荐一个应用Adorner做的表单对话框

一、目的:开发过程中经常会修改和查看一个Model的数据,一般情况下会自定义一个控件或Window去显示Model数据,但这种数据如果比较多会增加很多开发工作,本文介绍一种通用的方式,应用表达Form控件去简化处理,通常下只需在Model的Property属性上增加一些特性即可定制显示的表单信息和验证信息。 二、实现 显示效果如下  三、环境 VS2022 Net7 四、使用方式

spring mvc完整项目创建步骤记录

快速创建一个spring mvc项目(只有页面调用→到controller→到页面) 1、首先创建Dynamic Web Project 2、创建jsp页面index.jsp以及成功(/WEB-INF/view/success.jsp)和失败页面(/WEB-INF/view/error.jsp) index.jsp <%@ page language="java" contentType=

jQuery插件——表单验证(jquery.validate.js)

HTML <form id="loginForm"><label class="form__label--hidden" for="username">用户名:</label><input class="form__input" type="text" id="username" name="username" placeholder="用户名"><label class="form__labe

html标签转换成img图片

app 里的元素需要转换成图片 <script src="../assets/js/html2canvas.min.js"></script>$(function () {html2canvas(document.querySelector("#app"), {useCORS: true}).then(canvas => {layer.close(vm.layerIndex)var img =

2021-02-16物料档案条码添加和蓝牙条码标签打印,金蝶安卓盘点机PDA,金蝶仓库条码管理WMS系统

物料档案条码添加和蓝牙条码标签打印,金蝶安卓盘点机PDA https://member.bilibili.com/platform/upload-manager/article 本期视频我们来讲解一下汉点机PDA条码添加和条码标签蓝牙便携打印: 在实际使用中,我们商品有两种情况: 一种是商品本身就有条码, 比如:超市卖的可口可乐,牛奶等商品,商品本身就有69开头的国标码,那么我们就可以使用盘点

微信小程序表单

在我们的课程中,我们深入探讨了微信小程序表单的开发和应用。以下是我们课程的主要内容和收获:   一、课程目标   本课程旨在帮助学生掌握微信小程序表单的基本概念、开发流程和最佳实践。学生将学习如何创建和配置表单组件,处理表单数据,以及优化表单用户体验。   二、课程内容   微信小程序表单基础:介绍了微信小程序表单的概念、组成部分和基本用法。 表单组件的创建和配置:详细讲解了如何