zoukankan      html  css  js  c++  java
  • Spring MVC 数据绑定和表单标签库

    数据绑定是将用户输入绑定到领域模型的一种特性。作用是将 POJO 对象的属性值与表单组件的内容绑定。

    数据绑定的好处:

    1. 类型总是为 String 的 HTTP 请求参数,可用于填充不同类型的对象属性。

    2. 当输入验证失败时,会重新生成一个 HTML 表单。

    为了高效的使用数据绑定,还需要 Spring 的表单标签库。表单标签库中包含了可以用在 JSP 页面中渲染 HTML 元素的标签,为了能够使用这些标签,必须在 JSP 页面的开头处声明这个 taglib 指令

    <%@taglib uri="http://www.springframework.org/tags/form" prefix="form" %>

    表单标签库中的标签 每个标签都有相应的属性

    可以在下载的 Springframework 中找到详细说明

    标签   // 描述
    form  // 渲染表单元素
    input  // 渲染 <input type="text" /> 元素
    password // 渲染 <input type="text" /> 元素
    hidden  // 渲染 <input type="hidden" /> 元素
    textarea // 渲染 textarea 元素
    checkbox  // 渲染一个 <input type="checkbox" /> 元素
    checkboxes  // 渲染多个 <input type="checkbox" /> 元素
    radiobutton  // 渲染一个 <input type="radio" /> 元素
    radiobuttons  // 渲染多个 <input type="radio" /> 元素
    select  // 渲染一个选择元素
    option  // 渲染一个可选元素
    options  // 渲染一个可选元素列表
    erros  // 在 span 元素中渲染字段错误

    form 标签

    form 标签用于渲染 HTML 表单,form 标签必须利用渲染表单输入字段的其他任意标签。

    1. 该标签会自动绑定来自 Model 中的一个属性值到当前 form 对应的实体对象,默认是 command 属性,此时就可以在 form 表单提里面方便的使用该对象的属性了。

    2. 该标签我们在提交表单的时候使用除 GET、POST 之外的其他方法进行提交,包括 DELETE、PUT 等

     一般而言仍然需要使用 action 和 method 属性,这两个属性属于 HTML 属性。

    acceptCharset  // 
    cssClass  // 
    cssStyle  //
    htmlEscape  //
    modleAttribute  // 显示 corm backing object 的模型属性名称,默认为 command

    input 标签

    cssClass  // 
    cssStyle  //
    cssErrorClass  //
    htmlEscape  //
    path  // 要绑定的属性路径
    例如,下面这个 input 标签被绑定到 form backing object 的 isbn 属性
    <form:input id="isbn" path="isbn" cssErrorClass="errorBox" />
    将被渲染成
    <input  type="text" id="isbn" name="isbn" />
    cssErrorClass 属性不起作用,除非 isbn 属性中有输入验证错误,并且采用同一个表单重新显示用户输入,此时会被渲染成
    <input type="text" id="isbn" name="isbn" class="errorBox" />

    password 标签

    cssClass  //
    cssStyle  // 
    cssErrorClass  // 
    htmlEscape  //
    path  // 要绑定的属性路径
    showPassword  // 表示是否应该显示或遮盖密码,默认为 false
    <form:password id="pwd" path="password" cssClass="normal" />

    hidden 标签

     hidden 标签与 input 标签相似,只不过没有可是的外观,因此不支持 cssClass 和 cssStyle 属性

    htmlEscape  //
    path  // 
    <form:hidden path="productId" />

    textarea 标签

    textarea 基本上就是一个支持多行输入的 input 元素

    cssClass  // 
    cssStyle  // 
    cssErrorClass  // 
    htmlEscape  // 
    path  // 

    下面的 textarea 标签就是绑定到 form backing object 的 note 属性

    <form:textarea path="note" tabindex="4" rows="5" cols="80" />

    checkbox 标签

    cssClass  // 
    cssStyle  //
    cssErrorClass  // 
    htmlEscape  // 
    label  // 
    path  // 
    <form:checkbox path="outOfStock" value="Out Of Stock" />

    checkboxes 标签

    cssClass  // 
    cssStyle  // 
    cssErrorClass  //
    delimiter  // 
    element  // 
    htmlescape  // 
    items  // 用于生成 input 元素的对象的 Collection、Map 或者 Array 
    itemLabel  // 
    itemValue  // 
    path  // 

    下面的 checkboxes 标签将 model 属性 categoryList 的内容渲染为复选框。checkboxes 标签允许进行多个选择

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

    radiobutton 标签

    cssClass  // 
    cssStyle  // 
    cssErrorClass  // 
    htmlEscape  // 
    label  // 
    path  // 

    下面的 radiobutton 标签绑定到 newsletter 属性

    Computing Now <form:radiobutton path="newsletter" value="Computing Now" /> <br />
    Modern Health <form:radiobutton path="newslatter" value="Modern Health" />

    radionbuttons 标签

    cssClass  // 
    cssStyle  //
    cssErrorClass  //
    delimiter  //
    element  // 
    htmlEscape  // 
    items  // 
    itemLabel  // 
    itemValue  // 
    path  // 

    下面的 radiobuttons 标签将 model 属性 categoryList 的内容渲染为单选按钮。每次只能选择一个单选按钮:

    <form:radiobuttons path="category" items="${categoryList}" />

    select 标签

    cssClass  // 
    cssStyle  // 
    cssErrorClass  // 
    htmlEscape  // 
    items  // 
    itemLabel  // 
    itemValue  // 
    path  //

    items 属性特别有用,因为它可以绑定到对象的 Collection、Map、Array,为 select 元素生成选项。

    <form:select id="category" path="category.id" items="${categories}" itemLabel="name" itemValue="id" />

    option 标签

    cssClass  // 
    cssStyle  // 
    cssErrorClass  // 
    htmlEscape  // 
    <form:select id="category" path="category.id" items="${categories}" itemLabel="name" itemValue="id" >
        <option value="0">  --Please select -- </option>
    </form:select>

    options 标签

    cssClass  // 
    cssStyle  // 
    cssErrorClass  //
    htmlEscape  // 
    items  //
    itemLabel  //
    itemValue  //

    errors 标签

    cssClass  //
    cssStyle  //
    delimiter  //
    element  //
    htmlescape  //
    path  //
  • 相关阅读:
    javascript学习_函数调用模式与this取值
    Git 学习笔记(Git教程-廖雪峰)
    Linux学习一周初体验
    前言_写在立冬时
    2021.10.24驾考日记
    大二上学期的HTML杂碎
    AISing Programming Contest 2021(AtCoder Beginner Contest 202)D题题解
    并查集两优化——按秩合并与路径压缩
    [算法板子] 求拓扑序列(拓扑排序)
    浅谈迭代加深搜索 ( IDDFS )
  • 原文地址:https://www.cnblogs.com/0820LL/p/10014253.html
Copyright © 2011-2022 走看看