Struts2的%,#,$的区别,UI标签及其表单radio,checkbox,select回显数据(七)上

简介: Struts2的%,#,$的区别,UI标签及其表单radio,checkbox,select回显数据(七)

Struts2的UI标签,实际上就是将html中的表单再次增强了一下,html中的表单控件都有在struts2中相应的对照。


struts2标签不但拥有html标签的种种特点,还具有某些特殊的功能。


在介绍ui表单之前,再次讲一下注意点


注意点:


1.struts2的UI标签,默认的主题是struts.ui.theme=xhtml, 这样的主题是按照table表格进行处理的,


不如前端boostrap或者layui进行处理,所以将样式改变simple格式。


在struts.xml中:


    <!--修改struts中ui的主题,为simple-->
  <constant name="struts.ui.theme" value="simple"></constant>


2.在struts中css的样式为cssClass, 普通的html为class


3.在struts2中style的样式为cssStyle,普通的html为style 两者的用法是完全一样的。


4.struts2增加了errorClass和errorStyle的样式。


5.设置标签的显示名称用label


一. OGNL中 #, %,${}的作用与区别


一.一 # 的用法


一.一.一 访问非根对象时使用



ActionContext.getContext().put(“name”,“两个蝴蝶飞”);


访问时就用#做前缀:


<s:property value="#request.name"/>
<s:property value="#attr.name"/>


第二种常见的情况就是,在<s:set > 或者<s:iterator var=“user”> 时,取值时要用#user.属性,#set中的var值来获取值。


一.一.二 用于过滤和投影(projecting)集合


如books.{?#this.price>35}


遍历books集合,取出这个集合里面价钱>35的书本


一.一.三 用于构建Map


如: 构建性别的map


<s:radio list="#{‘男’:‘男’,‘女’:‘女’,‘保密’:‘保密’}" name=“sex”/>


也可以构建复选框和select框的,见下面标签的使用查看实例。


一.二 %的用法


用于强制转换成 ognl 表达式


当一个标签中的属性被翻译成字符串的时候,用%进行修饰,


告诉标签,这是一个OGNL表达式,让其按照OGNL表达式进行解析。 相当于强制转换。


如:


<%
    request.setAttribute("name","两个蝴蝶飞");
%>
<s:textfield name="name" value="#request.name"
label="不用%号的情况:"/> <br/>
<s:textfield name="name" value="%{#request.name}"
label="用%号的情况,强制解析:"/>


20200609113510384.png


特别是在form表单中,后面有value=“一个值” 的情况下,都用%{} 进行强制转换。


一.三 $的用法


这个$是ONGL的$,不是EL的,更不是Jquery的。 常用于配置文件中。


一.三.一 在db.properties文件中引用


<property  name="driverClass" value="${jdbc.driverClass}"/>


一.三.二 在struts.xml中跳转时传递数据(如id.parentId)使用


<result name="success" type="redirectAction">User_list.action?parentId=${parentId}</result>


一.三.三 在国际化时使用,做占位符


user.success=欢迎${name}登录
##但常用的为下面这种  Java的MessageFormat也是用这种方式
user.success=欢迎{0}登录


一.三.四 在验证Validate框架中使用


<validators>
    <field name="age">
            <field-validator type="int">
            <param name="min">18</param>
            <param name="max">58</param>
            <message>校验:年龄必须为${min}为${max}之间!</message>
        </field-validator>
    </field>
</validators>


二 UI 标签库


二.一 < s:form>标签的常用属性


    <s:form action="Single_getData"
    method="post" namespace="/" enctype="">
    </s:form>


这好像都没有什么可以说的,直接看就能明白。


如果要访问的路径是:user/User_add.action, 那么可以写


action="/user/User_add.action",namespace="/", 也可以写


action=“User_add.action”,namespace="/user", 建议使用后者。因为有的时候第一种情况,是无法确定是加上/user,还是不加/user。


二.二 <s:hidden> 标签的常用属性


s:hidden学用来表示隐藏域,在修改实体的表单数据中,常将id隐藏起来。


<s:hidden name="id" value="%{id}"/>


有时候,有没有隐藏的id值,是区分添加对象还是修改对象的依据。如果这个id值不为空,那么就是修改,如果为空,那么就是添加。


二.三 <s:textfiled> 普通文本域


姓名:<s:textfield name="name" value="两个蝴蝶飞"
    cssClass=".input" cssStyle="width:100px;" ></s:textfield>


重启启动服务器,便会显示出name了.


20200609113534352.png


二.四 <s:password> 密码隐藏域


<s:password name="password" value="1"></s:password>


二.五 <s:file> 文件上传框


<s:file name="upload" label="文件上传"></s:file>


二.六 <s:textarea> 文本域


<s:textarea name="description" cols="20" rows="3" value="这才是真正显示的数据呢">这是自我描述</s:textarea>


真正显示数据是在value属性中显示的,在中间是不显示的,这一点与html中的textarea标签不一样。


20200609113547995.png


二.七 <s:submit>提交按钮


<s:submit value="提交"/>


二.八 <s:reset> 重置按钮


<s:reset value="重置"></s:reset>


接下来,就是最重要的UI控件,单选框,复选框,选择框了。 说其重要,主要表现在数据回显的角度上看得。


在工作开发中,常常会用到 这三个框的回显。


用JS判断相对来说比较麻烦,用Struts自己封装的UI控制就相对简单了。

相关文章
|
4月前
|
前端开发
Element UI 【实战】纯前端对表格数据进行增删改查(内含弹窗表单、数据校验、时间日期格式)
Element UI 【实战】纯前端对表格数据进行增删改查(内含弹窗表单、数据校验、时间日期格式)
186 6
|
3月前
|
前端开发 JavaScript UED
element-ui 表格数据究竟隐藏着怎样的神秘样式与格式化技巧?快来揭开谜底!
【8月更文挑战第22天】《element-ui 表格数据样式及格式化案例》展示了如何利用 element-ui 的表格组件实现美观且易读的数据展示。通过简单配置,可以自定义表格样式,如边框、背景色等,并通过 formatter 实现数据格式化,例如将成绩保留一位小数。此外,还能依据条件设置行样式,如成绩达优则高亮显示,从而增强用户体验和数据可读性。
64 1
|
3月前
|
计算机视觉
ElementUI——vue2+element-ui 2.x的动态表格和表单
ElementUI——vue2+element-ui 2.x的动态表格和表单
130 1
|
4月前
element UI 组件封装--搜索表单(含插槽和内嵌组件)
element UI 组件封装--搜索表单(含插槽和内嵌组件)
130 5
|
4月前
|
JavaScript
vue + element UI 表单中内嵌自定义组件的表单校验触发方案
vue + element UI 表单中内嵌自定义组件的表单校验触发方案
152 5
|
4月前
Element UI【级联选择器】el-cascader 获取选中内容的 label 数据,鼠标悬浮显示超长内容
Element UI【级联选择器】el-cascader 获取选中内容的 label 数据,鼠标悬浮显示超长内容
641 3
|
4月前
Element UI 多选表格--判断勾选数据行的 Checkbox 时为选中还是取消选中
Element UI 多选表格--判断勾选数据行的 Checkbox 时为选中还是取消选中
50 1
|
4月前
Element UI 多选表格【翻页多选】简易版(不支持翻页多选数据反显)
Element UI 多选表格【翻页多选】简易版(不支持翻页多选数据反显)
105 0
Element UI 多选表格【翻页多选】简易版(不支持翻页多选数据反显)
|
4月前
软件研发核心问题之在需求拆解过程中,“数据与UI如何关联”的问题如何解决
软件研发核心问题之在需求拆解过程中,“数据与UI如何关联”的问题如何解决
|
4月前
|
UED
Element UI 一键校验多表单(v-for循环表单,异步校验规则,v-for 中的 ref 属性,避坑 forEach 不支持异步 await )
Element UI 一键校验多表单(v-for循环表单,异步校验规则,v-for 中的 ref 属性,避坑 forEach 不支持异步 await )
52 0